2014-03-19 1 views
6

긴 제목이지만 여기에 더 좋은 설명입니다.Angularjs + Ionic Framework : 이온 탭 탐색을 표시하지만 자체 탭을 정의하지 않고 새 경로를 만드는 방법은 무엇입니까?

"로그인"이라는 템플릿 html 파일이 있습니다. 내가 UI-SREF = "로그인"을 사용하여 너무

.state('login', { 
    url: '/login', 
    templateUrl: 'templates/login.html', 
    controller: 'createAccountCtrl' 
}) 

같은 app.js에 경로를 정의 내 요구에 적합 어디에서이 템플릿에 링크 할 수 있습니다.

그러나 기본 앱은 기본 경로 "탭"을 사용하여 기본 탐색을 포함하는 탭 템플릿을로드합니다.

.state('tab.about', { 
    url: '/about', 
    views: { 
    'about-tab': { 
     templateUrl: 'templates/about.html', 
     controller: 'aboutCtrl' 
    } 
    } 
}) 

    <ion-tabs tabs-style="tabs-icon-top" tabs-type="tabs-default"> 

    <!-- Home Tab --> 
    <ion-tab title="Home" icon="icon ion-home" href="#/tab/home"> 
     <ion-nav-view name="home-tab"></ion-nav-view> 
    </ion-tab> 

    <!-- Products Tab --> 
    <ion-tab title="Earn Points" icon="icon ion-ios7-plus-outline" href="#/tab/retail-store"> 
     <ion-nav-view name="retail-store-tab"></ion-nav-view> 
    </ion-tab> 

    </ion-tabs> 

내 문제는 이것입니다. 로그인 페이지에 다른 모든 페이지처럼 기본 앱의 탐색 기능이 있어야합니다. 이렇게하면 로그인 페이지로 이동하는 사용자는 로그인하지 않으면 집이나 페이지를 계속 탐색 할 수 있습니다. 하지만, 내비게이션 탭/자체 아이콘을 표시하고 싶지는 않습니다.

탭 html을 login.html 템플릿 파일에 직접 추가하거나 로그인 아이콘/탭을 숨길 수 있습니다. 나는 제안과 도움에 열려 있습니다. 고맙습니다!

답변

14

탭에는 고유 한 탭 아이콘이 있습니다. 따라서 로그인 페이지는 탭 아이콘을 만들지 않고 탭 요약보기 안에 넣을 수 없습니다.

로그인 페이지를 탭 추상보기 아래에 두는 대신 로그인 페이지에 대해 별도의 탭 탐색을 설정해야합니다.

색인 페이지에 다음보기를로드하십시오.

<ion-view title="'Login'"> 

<ion-content has-header="true" has-footer="true" padding="true"> 

Login page content goes here 

</ion-content> 

<div class="tabs tabs-icon-left"> 
    <a class="tab-item" href="#/tab/home"> 
    Home 
    </a> 
    <a class="tab-item" href="#/tab/about"> 
    About 
    </a> 
</div> 

</ion-view> 
+0

감사합니다. 이것은 정확하게 내가하려고했던 것입니다. 불행히도 저는 아직 변호사를 선임하지 않았지만 감사합니다. 완전한 – tbondt

관련 문제