我使用的是$stateprovider
从我的角度应用程序角度-UI-路由器如下:
.state('order', {
url: "/order/:id",
templateUrl: "/myapp/order"
})
在上述情况下,我们传递的id
到所述控制器,我们可以将其称为ui-sref="order({id: 1234})"
。
但现在我想通过不使用控制器进行到后端的直接调用,并通过上面如下:
.state('order', {
url: "/order",
templateUrl: "/myapp/order/:id"
})
但很明显,我的语法是错在这里。 我如何做到这一点的情况?
我创建工作示例 。 据adjsuting thiw Q&A:
试图动态地设置在控制器中的templateUrl基于恒定
让我们的模板template-A.html
和template-B.html
在我们的例子。 随着国家高清templateProvider
是这样的
$stateProvider
.state('order', {
url: '/order/:id',
templateProvider: function($http, $templateCache, $stateParams) {
var id = $stateParams.id || 'A';
var templateName = 'template-' + id + '.html';
var tpl = $templateCache.get(templateName);
if (tpl) {
return tpl;
}
return $http
.get(templateName)
.then(function(response) {
tpl = response.data
$templateCache.put(templateName, tpl);
return tpl;
});
},
controller: function($state) {}
});
现在我们可以这样调用
<a href="#/order/A">
<a href="#/order/B">
检查它在这里
而且更重要的是,与angularjs的最新版本,我们甚至可以使超级简单:
$ templateRequest
更新plunker
.state('order', {
url: '/order/:id',
templateProvider: function($templateRequest, $stateParams) {
var id = $stateParams.id || 'A';
var templateName = 'template-' + id + '.html';
return $templateRequest(templateName);
},
controller: function($state) {}
});