2014-01-20 3 views
0

각도 UI-Router는 중첩 된 상태를 사용하지 않는 한 예상대로 작동합니다.Jade Nested Views가있는 Angular Ui-Router가 깨졌습니다.

$urlRouterProvider.otherwise("/marketing"); 
$stateProvider 
    .state('marketing', { 
    url: '/marketing', 
    templateUrl: 'partials/marketing', 
    }) 
    .state('landing', { 
    url: '/landing', 
    templateUrl: 'partials/marketing-landing', 
    }) 
    .state('features', { 
    url: '/features', 
    templateUrl: 'partials/marketing-features', 
    }) 

을 그리고 이것은하지 않습니다 : 예를 들어,이 작품

$urlRouterProvider.otherwise("/marketing"); 
$stateProvider 
    .state('marketing', { 
    url: '/marketing', 
    templateUrl: 'partials/marketing', 
    }) 
    .state('marketing.landing', { 
    url: '/landing', 
    templateUrl: 'partials/marketing-landing', 
    }) 
    .state('marketing.features', { 
    url: '/features', 
    templateUrl: 'partials/marketing-features', 
    }) 

자식 URL (예 :/마케팅/착륙.)를 SREF 링크 또는 직접를 통해 하나로드 어떠한 경우에도 URL 주소를 입력하면 주소 표시 줄이 하위 URL로 변경되지만 부모 부분 (partials/marketing) 만 표시됩니다.

Index.jade :

div(ui-view) 

marketing.jade :

h1 marketing layout 

div(ui-view) 

마케팅 landing.jade :

h1 This is the landing page 

마케팅 features.jade :

h1 This is the features page 

AngularUI를 처음 사용했습니다. 제가 제공 할 수있는 다른 관련 정보를 알려주십시오.

답변

1

첫 번째 .ui-view-work correct! 그러나 중첩 된 UI 뷰는 다음과 같이 일반 HTML로 마크 업해야합니다 : UI를보기 속성에 빈 문자열을 지정

.row 
    .col-md-12 
    h4 Nested UI-VIEW 
    <div ui-view></div> 
0

나를 위해 작동하는 것 같다. 이렇게하면 jade 템플릿에서 평범한 HTML을 유지할 수 있으며 ui-view에서 기본 jade 컨텐츠를 중첩 할 수 있습니다.

.row 
    .col-md-12 
    h4 Nested UI-VIEW 
    div(ui-view='') 
     p Using this approach we can have default content before ui-view is loaded