Angular ui-路由器子状态不更新视图
Angular ui-router sub state does not update view
这是一个angular-ui-路由配置。我的问题是关于最后一个,facility.
的表演动作
$stateProvider
.state('app', {
url: '',
abstract: true,
templateUrl: helper.basepath('app.html'),
controller: 'AppController',
resolve: helper.resolveFor('fastclick', 'modernizr', 'icons', 'screenfull', 'animo', 'sparklines', 'slimscroll', 'classyloader', 'toaster', 'whirl')
})
.state('app.facility', {
parent: 'app',
url: '/facility',
title: 'Einrichtungen',
templateUrl: helper.basepath('Facility/Index.html'),
controller: 'FacilityController',
resolve: {
Facilities: ['Facility', function(Facility) {
return Facility.query().$promise;
}]
}
})
.state('app.facility.show', {
url: '/:id',
title: 'Einrichtung Detail',
templateUrl: helper.basepath('Facility/Show.html'),
controller: 'FacilityItemController',
resolve: {
Facility: ['Facility', '$stateParams', function(Facility, $stateParams) {
return Facility.get({id: $stateParams.id}).$promise;
}]
}
})
当我这样调用 link 时
<a ui-sref=".show({id: facility.id})">{{facility.name}}</a>
URL 发生变化,资源和 Show.html 模板由 ajax 加载,但视图没有变化。没有发生错误。
当我将状态重命名为 app.facilityShow(无子状态)时,视图加载。你知道我做错了什么吗?
来自ui-router wiki
A note on relative ui-sref targets:
You can also use relative state paths within ui-sref, just like the relative paths passed to state.go(). You just need to be aware that the path is relative to the state that the link lives in, in other words the state that loaded the template containing the link.
您需要处于 app.facility
状态才能跟随 ui-sref
工作
<a ui-sref=".show({id: facility.id})">{{facility.name}}</a>
好的,我想我明白了。我已将状态 app.facility
重命名为 app.facility.index
并定义了一个抽象的新状态 app.facility,如下所示:
.state('app.facility', {
abstract: true,
url: '/facility',
template: '<div ui-view></div>'
})
模板部分是必需的。没有它,它不起作用。
这是一个angular-ui-路由配置。我的问题是关于最后一个,facility.
的表演动作$stateProvider
.state('app', {
url: '',
abstract: true,
templateUrl: helper.basepath('app.html'),
controller: 'AppController',
resolve: helper.resolveFor('fastclick', 'modernizr', 'icons', 'screenfull', 'animo', 'sparklines', 'slimscroll', 'classyloader', 'toaster', 'whirl')
})
.state('app.facility', {
parent: 'app',
url: '/facility',
title: 'Einrichtungen',
templateUrl: helper.basepath('Facility/Index.html'),
controller: 'FacilityController',
resolve: {
Facilities: ['Facility', function(Facility) {
return Facility.query().$promise;
}]
}
})
.state('app.facility.show', {
url: '/:id',
title: 'Einrichtung Detail',
templateUrl: helper.basepath('Facility/Show.html'),
controller: 'FacilityItemController',
resolve: {
Facility: ['Facility', '$stateParams', function(Facility, $stateParams) {
return Facility.get({id: $stateParams.id}).$promise;
}]
}
})
当我这样调用 link 时
<a ui-sref=".show({id: facility.id})">{{facility.name}}</a>
URL 发生变化,资源和 Show.html 模板由 ajax 加载,但视图没有变化。没有发生错误。
当我将状态重命名为 app.facilityShow(无子状态)时,视图加载。你知道我做错了什么吗?
来自ui-router wiki
A note on relative ui-sref targets:
You can also use relative state paths within ui-sref, just like the relative paths passed to state.go(). You just need to be aware that the path is relative to the state that the link lives in, in other words the state that loaded the template containing the link.
您需要处于 app.facility
状态才能跟随 ui-sref
工作
<a ui-sref=".show({id: facility.id})">{{facility.name}}</a>
好的,我想我明白了。我已将状态 app.facility
重命名为 app.facility.index
并定义了一个抽象的新状态 app.facility,如下所示:
.state('app.facility', {
abstract: true,
url: '/facility',
template: '<div ui-view></div>'
})
模板部分是必需的。没有它,它不起作用。