我正在尝试让AngularJS的UI-Router选择已定义的状态(即``项目'')，如果都不匹配，则默认为``root''状态。 “root”状态应使用远程API(Firebase)进行检查，并根据结果加载适当的 View 。
下面的示例不能满足这些要求之一:
1)“http://website.com/project”与“root”状态匹配，而不与(先前定义的)“project”状态匹配。
2)“fbutil”未在“templateUrl”函数中定义，因此无法注入(inject)。
请帮助我解决这些问题。
angular.module('app')
.config(['$stateProvider', '$urlRouterProvider',
function($stateProvider, $urlRouterProvider) {
$stateProvider
.state('project', {
url: '/project',
views: {
'mainView': {
controller: 'ProjectCtrl as project',
templateUrl: '/views/project.html'
}
}
})
.state('root', {
url: '/:id',
views: {
'mainView': {
templateUrl: function($stateParams, fbutil) {
var ref = fbutil.ref('user_data', id);
ref.once('value', function(dataSnapshot) {
return '/views/' + dataSnapshot.$val() +'.html';
}, function(error) {
return '/views/root.html';
});
}
}
}
})
}
]);
最佳答案
我们不能在这里使用templateUrl-如doc中所述:
templateUrl(可选)
templateUrl的参数是固定的。
因此，我们必须使用templateProvider
templateProvider(可选)
templateProvider:
function(MyTemplateService, params) {
return MyTemplateService.getTemplate(params.pageId);
}
查看:
关于javascript - 如何将服务注入(inject)AngularJS的UI-Router templateUrl函数？，我们在Stack Overflow上找到一个类似的问题：https://stackoverflow.com/questions/33838313/