UI 라우터가 범위 상속을 위해 중첩 된보기

Question

UI 중첩 된보기를 이해하는 데 문제가 있습니다 ... 중첩 된보기 ... 더 구체적으로 어떻게 생겼는지 ... ...?

내 $ scope 속성을 상속해야하므로 이해해야합니다.

나는

$stateProvider 
.state('contacts', { 
    abstract: true, 
    url: '/contacts', 
    templateUrl: 'contacts.html', 
    controller: function($scope){ 
     $scope.contacts = [{ id:0, name: "Alice" }, { id:1, name: "Bob" }]; 
    }   
}) 
.state('contacts.list', { 
    url: '/list', 
    templateUrl: 'contacts.list.html' 
}) 
.state('contacts.detail', { 
    url: '/:id', 
    templateUrl: 'contacts.detail.html', 
    controller: function($scope, $stateParams){ 
     $scope.person = $scope.contacts[$stateParams.id]; 
    } 
}) 

가 그럼 난

$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 ... } 
     } 
    } 
    }) 

그 혼란 나에게와 이후의 모든 조금 내가 필요 $ 범위 상속을 필요로하는 문서에이 같은 내용이 워드 프로세서에서이 예제를 참조 내 견해를 중첩시키기 위해서 - 어떤 견본인지는 모르겠다. 내가이 함께 달성하기 위해 노력하고있어 query.html에 단순한 검색 폼, 일단 사용자가 입력하거나 다음을 검색어를 선택

$locationProvider.html5Mode(false); 
    $stateProvider 
     .state('search', { 
     abstract: true, 
     url: '/search', 
     controller: 'searchCtrl', 
     controllerAs: 'vm', 
     templateUrl: 'search/index.html'  
    }) 
     .state('search.query', { 
     url: '/', 
     controller: 'searchCtrl', 
     controllerAs: 'vm', 
     templateUrl: 'search/query.html' 
     }) 
     .state('search.results', { 
     url: '/?q',//for query parameter in url 
     controller: 'searchCtrl', 
     controllerAs: 'vm', 
     templateUrl: 'search/results.html' 
     }); 
$urlRouterProvider.otherwise('/'); 

여기 UPDATE

내 상태입니다 다른 검색 양식과 결과로 search.html로 이동합니다.

이들은 내 템플릿이며 올바르게 설정했지만 아무 것도 표시되지 않기 때문에 잘못되었다고 생각합니다.

Answer 1

첫 번째 것은 범위 개체를 상속하는 요구 사항을 충족하는 중첩 된 상태의 예입니다.

앞에 붙여서 URL 삽입, 템플릿, 쌍 컨트롤러를 표시하고 은 $ 상속 : 예 상태/하위 상태-A는 상태/하위 상태-B 당신이 문서에서 찍은 첫 번째 조각 위의 코멘트를 읽고 scope 객체입니다.

두 번째 예제는 상태별로 여러 개의보기를 정의하고 사용 사례에 따라 각각을 사용할 수있는 중첩 된보기입니다. 워드 프로세서 :

그런 다음 자신의 템플릿 (템플릿, templateUrl, templateProvider), 컨트롤러 (컨트롤러, controllerProvider)을 설정할 수 있습니다보기의 각보기.