Angular ui-router嵌套视图分隔模板和控制器

Question

我有以下文件：

index.html
car.html
truck.html

mainCtrl.js
carCtrl.js
truckCtrl.js

并希望制作此类路线：

#/search (template: index.html, controller: mainCtrl.js)
#/search/car (template: car.html, controller: carCtrl.js)
#/search/truck (template: truck.html, controller: truckCtrl.js)

index.html包含两个必须重定向到#/search/car的链接，第二个：#/search/truck

car.html & truck.html必须加载nested view

请有人帮我完成这项任务

Answer 1

我想这样的事情可以解决问题。

$stateProvider
    .state('search', {
        url: '/search',
        controller: 'mainCtrl',
        templateUrl: '/path/to/index.html',
    })
    .state('search.car', {
        url: '/car'
        controller: 'carCtrl',
        templateUrl: '/path/to/car.html',
    })
    .state('search.truck', {
        url: '/truck'
        controller: 'truckCtrl',
        templateUrl: '/path/to/truck.html',
    })

将ui-view标记放在索引部分的某处。