我的页面上有按钮,如下所示:
<button ui-sref=".viewer({maId: gridItem.MAID})" class="btn btn-info">
<span class="glyphicon glyphicon-search"></span>
</button>
点击我想用ui-sref改变状态。我目前处于州/州,我想进入/ status / {maId}州。
这是我的routes.js
(function () {
'use strict';
angular
.module('MA.status')
.config(function ($stateProvider) {
$stateProvider
.state('status', {
url: '/status',
controller: 'Status as vm',
templateUrl: 'app/pages/status/status.html?v=0.0.1'
})
.state('status.viewer', {
url: '/:maId',
controller: "Viewer as vm",
templateUrl: 'app/pages/status/viewer.html?v=0.0.1',
resolve: {
maId: function ($stateParams) {
return ($stateParams.id);
}
}
});
});
})();
当我点击按钮url更改但html没有更改时,它仍然是来自状态状态而不是status / {maId}的templateUrl。控制台中没有错误。
问题是什么?
答案 0 :(得分:1)
你的按钮上的ui-sref应该是这样的:
<button ui-sref="status.viewer({maId: gridItem.MAID})" class="btn btn-info">
<span class="glyphicon glyphicon-search"></span>
</button>
您必须插入路线中声明的整个州名。
修改强>
如果没有根据您的评论查看整个HTML结构,我猜你会错过状态模板中的ui-view
指令。如果您正在使用子状态,则父母需要拥有子状态才能显示子项的内容/模板。如果您希望它以现在的方式工作,您可以将status.viewer
状态设置为一个完整的独立状态。但是如果你想把它作为一个子状态,只需在status
状态的某处添加它,就会出现子状态的内容。
<div ui-view></div>
所以进行ui-sref
更改并将ui-view
添加到您的父状态模板。