usage - update title in angularjs



온센 UI에서 여러 html 파일 사용 (1)

<ons-template> 태그를 제거하십시오. index.html 에서 템플릿을 정의하는 경우에만 필요합니다.

방금 온천을 발견했고 디자인과 느낌이 마음에 듭니다.

그래도 문제가 있습니다.

http://onsen.io/guide/overview.html#DefiningMultiplePagesinSingleHTML

여기에 그것은 말합니다 : "별도의 파일에 menu.html과 content.html을 만드는 대신, 같은 페이지에서 페이지 내용을 정의 할 수도 있습니다."

나는 하나의 html 파일에 내 응용 프로그램을 갖고 싶지 않으므로 각각의 템플릿을 별도의 파일에 넣으려고했다. 이것은 내 파일 구조입니다.

www
- index.html
- products.html
- services.html

이것은 내 탭 모음입니다.

<ons-tabbar>
  <ons-tabbar-item active="true" page="products.html">
    <div class="tab">
      <ons-icon icon="ion-home" class="tab-icon"></ons-icon>
      <div class="tab-label">Products</div>
    </div>
  </ons-tabbar-item>

  <ons-tabbar-item page="services.html">
    <div class="tab">
      <ons-icon icon="ion-gear-a" class="tab-icon"></ons-icon>
      <div class="tab-label">Services</div>
    </div>
  </ons-tabbar-item>
</ons-tabbar>

services.html의 내용을 수정 (products.html도 비슷합니다) :

<ons-template id="services.html">
  <ons-page>
    <ons-toolbar>
      <div class="center">Services</div>
    </ons-toolbar>

    <ons-list>
      <ons-list-item>Item1</ons-list-item>
      <ons-list-item>Item2</ons-list-item>
      <ons-list-item>Item3</ons-list-item>
    </ons-list>
  </ons-page>
</ons-template>

END EDIT

이제 앱이로드되면 (Firefox, Chrome, iOS 에뮬레이터) 탭바와 빈 콘텐츠가 표시됩니다. 콘솔에서 외부 HTML 파일이 아직로드되지 않았 음을 알 수 있습니다. 서비스를 클릭하면 브라우저 services.html 파일을 가져 오지만 표시되지 않습니다. 제품을 클릭하면 products.html 파일이로드되지만 표시되지 않습니다.

마지막으로 두 번째로 서비스를 클릭하면 외부 HTML 파일의 내용이 올바르게 표시됩니다.

이거 버그 야? 해결 방법이 있습니까? ons.ready () 이벤트에서 $ templateCache에 페이지를로드하려고했습니다. 성공적으로로드되었지만 두 번째 클릭까지 다시 표시되지 않았습니다 ...

이와 같은 위대한 프레임 워크가 프로젝트를 여러 파일로 분할하지 않으면 부끄러운 일입니다.





onsen-ui