ionic - 적절한 내용이 보이지 않는 서브 뷰

Question

이온과 관련하여 이상한 문제가 있습니다.

두 개의 하위보기 (roomContent 및 settingsContent)가있는 페이지 (setup.html)를 만들려고합니다. 다음과 같은

내 UI 라우터 모양이 같은

$stateProvider 
.state('setup', { 
    url: '/setup', 
    abstract: true, 
    templateUrl: 'setup/setup.html', 
    controller: 'setupCtrl', 
}) 
.state('setup.room', { 
    url: '/:roomID', 
    views: { 
    'roomContent': { 
     templateUrl: 'setup/room/roomSetup.html', 
     controller: 'roomSetupCtrl' 
    } 
    } 
}) 
.state('setup.menu', { 
    url: '/settings', 
    views: { 
    'settingsContent': { 
     templateUrl: 'setup/menu/menuSetup.html' 
    } 
    } 
}); 

및 setup.html 템플릿 : 예상처럼

// This should display content for roomContent (state: setup.room) 
<ion-nav-view name="roomContent"> 
    // ionic tabs here - don't want them on settings subview! 
</ion-nav-view> 

// This should display content for settingsContent (state: setup.menu) 
<ion-nav-view name="settingsContent"></ion-nav-view> 

그러나이 작동하지 않습니다.

기본적으로 roomSetup으로 이동하면 콘텐츠가 표시되지 않습니다. html로 ion-nav-view의 순서를 변경하면 (settings 전에 setup) settings 콘텐츠가 표시되지 않습니다. 그것은 최신 ion-nav-view 만 표시하는 것처럼 솔기가 있습니다.

의견이 있으십니까?

덕분에 나는이 문제를 해결 끝에

편집

.

폴더 구조를 약간 변경하고 설정 상태와 새 설정 상태를 만들었습니다. 하나의 설정 상태 만 있지만 여러 설정이 있다는 것을 알았습니다. 도움이된다면 이것은, 새로운 구조 :

.state('setupRoom', { 
    url: '/setup/:roomID', 
    templateUrl: './sections/roomSetup/roomSetup.tpl.html', 
    controller: 'roomSetupCtrl', 
    data: { 
    requireLogin: false 
    } 
}).state('settings', { 
    url: '/settings', 
    abstract: true, 
    templateUrl: './sections/settings/settings.tpl.html', 
    data: { 
    requireLogin: false 
    } 
}).state('settings.menu', { 
    views: { 
    settingsContent: { 
     templateUrl: './sections/settings/menu/menuSettings.tpl.html' 
    } 
    } 
}).state('settings.system', { 
    url: '/system', 
    views: { 
    settingsContent: { 
     templateUrl: './sections/settings/system/systemSettings.tpl.html', 
     controller: 'settingsSystemCtrl' 
    } 
    } 
}); 

Answer 1

이 여러없는 상태를 정의하지만, 여러 경관을 감상 할 수있는 하나의 상태로되어야한다. 당신이 한 것처럼, 동시에 두 개의 별도 URL이 필요합니다. UIRouter 에서처럼 URL이 상태에 연결되어 있기 때문에 가능하지 않습니다.

$stateProvider 
.state('report',{ 
views: { 
    'filters': { 
    templateUrl: 'report-filters.html', 
    controller: function($scope){ ... controller stuff just for filters view ... } 
    }, 
    'tabledata': { 
    templateUrl: 'report-table.html', 
    controller: function($scope){ ... controller stuff just for tabledata view ... } 
    }, 
    'graph': { 
    templateUrl: 'report-graph.html', 
    controller: function($scope){ ... controller stuff just for graph view ... } 
    } 
} 
}) 

당신은 중첩 된 뷰가 필요

Answer 2

UI-Router docs about multiple views를 참조하십시오

설치 상태 구성에서을

views: { 
    'setup@': { 
    templateUrl: 'setup/setup.html', 
    controller: 'setupCtrl' 
    } 
} 

지금 사용 roomContent@setup 및 settingsContent2@setup

편집 :

여전히 작동하지 않는다면 을 <div ui-view>으로 바꿀 수 있습니다.

은 자세한 내용은 https://github.com/angular-ui/ui-router/wiki/Multiple-Named-Views에게 답장을 보내