这是我的主要应用程序(app.js)
(function(ng, module) {
module.config(['$stateProvider', '$urlRouterProvider', function( $stateProvider, $urlRouterProvider){
$urlRouterProvider.otherwise("app");
$stateProvider.state('login', {
url: 'login',
templateUrl: '/assets/templates/pages/login.html'
}).state('root', {
url: '',
templateUrl: '/assets/templates/pages/index.html'
});
}]);
}) (angular, angular.module('myapp', ['ui.router', 'myapp.submodule']));
这是子模块(submodule.js)
(function(ng, module) {
module.config(['$stateProvider', function($stateProvider){
$stateProvider.state('root.substate', {
url: 'todo/{type}',
templateUrl: '/assets/app/todo/todo.html',
controller: function($stateParams, $scope) {
// Do stuff.
}
});
}]);
}) (angular, angular.module('myapp.submodule', ['ui.router']));
预期的行为是
这很好用。
但是,如果我刷新页面,状态不会被激活,我会被发送回" app"。为什么呢?
答案 0 :(得分:7)
我们有两个 root 状态(无父级)状态。这些应该是没有网址,或者它应该以一些独特的符号开头 - 最好选择(URI规范)始终为 /
:< / p>
// domain/app/login - easy to find
.state('login', {
url: 'login',
...
})
// no def === domain/app
.state('root', {
url: '',
...
});
现在,即使我们的url
州,我们也会使用一些'root'
:
// domain/app/
.state('root', {
url: '/',
...
});
那是我们的孩子&root;根状态&#39;还将包含父url
部分。所以,如果我们使用这个
// this is a child and its url will be in fact: domain/app//todo/sometype
.state('root.substate', {
url: '/todo/{type}',
...
});
请注意,这样,我们的url现在将为子包含//(双斜杠)
为避免这种情况,我们可以使用UI-Router功能&#39; ^&#39;
// this stat will not use the parent part
// this will work domain/app/todo/sometype
.state('root.substate', {
url: '^/todo/{type}',
...
});
检查文档:
Absolute Routes (^)如果您想要使用绝对网址匹配,则需要在网址字符串前加上一个特殊符号&#39; ^&#39;。
$stateProvider
.state('contacts', {
url: '/contacts',
...
})
.state('contacts.list', {
url: '^/list',
...
});
答案 1 :(得分:0)
我知道还有很多时间。但关于刷新的问题。如果您希望保持与刷新之前相同的网址,则应添加下一个:
angular.module('app').run(['$state', '$stateParams', function($state, $stateParams) {
//this solves page refresh and getting back to state
}]);
在前一个回答中提及here