角ui.router重载父templateProvider [英] Angular ui.router reload parent templateProvider
问题描述
我有加载基于用户类型导航抽象基模板。这部分工作在初始加载。问题是我不能让当用户或明算账已登录父templateProvider重新加载。我曾尝试解决这里重载父模板，但导航模板不受影响。有没有办法重新加载templateProvider，或这样做的更好的办法？理想情况下，我不会要的导航提供程序添加到每个孩子的路线。
该路线：
$ stateProvider
.STATE（'基地'，{
摘要：真实，
观点：{
内容：{
模板：'＆LT; UI的视图＆gt;＆LT; / UI的视图＆gt;，
}，
导航：{
templateProvider：函数（$ templateFactory，用户，$ stateParams）{
如果（User.exists（））{
VAR URL ='/静态/ HTML /资产净值/+ User.get.type +'的.html';
返回$ templateFactory.fromUrl（URL）;
}
其他{
返回false;
}
}
}
}
}） .STATE（'base.index'，{
网址：'/'，
控制器：'LoginController中'，
templateUrl：静态/ HTML /着陆/ login.html的
}）
从 GitHub的问题企图控制功能：
scope.login_submit =功能（E）{
亦即preventDefault（）;
User.login（scope.login，功能（RES）{
$ state.transitionTo（
base.dashboard'，空，
{重载：真的，继承：真实，通知：真正}
）;
}）;
};
这将是调整状态DEF：
.STATE（'基地'，{
摘要：真实，
观点：{
''：{
模板：'＆LT; UI的视图＆gt;＆LT; / UI的视图＆gt;，
}，
/ *
导航：{
templateProvider：函数（$ templateFactory，用户，$ stateParams）{
如果（User.exists（））{
VAR URL ='/静态/ HTML /资产净值/+ User.get.type +'的.html';
返回$ templateFactory.fromUrl（URL）;
}
其他{
返回false;
}
}
} * /
导航：{
templateProvider：['用户'，'$ templateRequest'功能（用户，templateRequest）{ VAR tplName ='模板/ templateNotExists.html'; 如果（User.exists）{ tplName ='模板/ templateExists.html';
} 返回templateRequest（tplName）;
}]，
}，
}
}）
我们可以看到，我们使用的新的的功能叫做 '$ templateRequest ，摆脱HTML模板服务器，根据网址。
和这些控制器和服务
.controller（'的LoginController'，['$范围，用户，函数（$范围，用户）{
$ scope.User =用户;
}]）
.factory（用户，函数（）{返回{存在：假的，};}）
这是孩子的base.index状态的模板的内容：
＆LT;输入类型=复选框NG模型=User.exists/＆GT;
＆LT;按钮NG点击=$ state.go（'base.index'，空，{重装：真}）＆GT;重装＆LT; /按钮＆GT;
检查这里所有行动
I have an abstract base template that loads the navigation based on the user type. This part works on initial loading. The problem is I can't get the parent templateProvider to reload when the user has logged in or out afterwards. I have tried the solutions here to reload the parent template, but the nav templates aren't affected. Is there a way to reload the templateProvider, or a better way of doing this? Ideally I won't have to add the nav provider to every child route.
The routes:
$stateProvider
.state('base', {
abstract: true,
views: {
content: {
template: '<ui-view></ui-view>',
},
nav: {
templateProvider: function ($templateFactory, User, $stateParams){
if(User.exists()){
var url = '/static/html/navs/' + User.get.type + '.html';
return $templateFactory.fromUrl(url);
}
else{
return false;
}
}
}
}
})
.state('base.index', {
url: '/',
controller: 'loginController',
templateUrl: 'static/html/landing/login.html'
})
Controller function with attempts from github issue:
scope.login_submit = function(e){
e.preventDefault();
User.login(scope.login, function(res){
$state.transitionTo(
'base.dashboard', null,
{reload: true, inherit: true, notify: true }
);
});
};
I created working example here. It is coming from this Q & A
This would be the adjusted state def:
.state('base', {
abstract: true,
views: {
'': {
template: '<ui-view></ui-view>',
},
/*
nav: {
templateProvider: function ($templateFactory, User, $stateParams){
if(User.exists()){
var url = '/static/html/navs/' + User.get.type + '.html';
return $templateFactory.fromUrl(url);
}
else{
return false;
}
}
},*/
nav: {
templateProvider: ['User', '$templateRequest', function(User, templateRequest){
var tplName = 'templates/templateNotExists.html';
if(User.exists) {
tplName = 'templates/templateExists.html';
}
return templateRequest(tplName);
}],
},
}
})
As we can see, we use new feature called '$templateRequest', to get html template from server, based on the url.
and these are controllers and services
.controller('loginController', ['$scope', 'User', function ($scope, User) {
$scope.User = User;
}])
.factory('User', function(){ return { exists: false, }; })
And this is the content of the template of the child 'base.index' state:
<input type="checkbox" ng-model="User.exists" />
<button ng-click="$state.go('base.index', null, {reload: true})" >reload</button>
Check that all in action here
这篇关于角ui.router重载父templateProvider的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
