在我正在研究的一个有角度的应用程序中,我希望有一个抽象的父状态,它必须解决其所有子状态的某些依赖关系.具体来说,我希望所有州都要求经过身份验证的用户从某个authroot状态继承该依赖关系.
我遇到的问题是父依赖关系并不总是被重新解决.理想情况下,我希望让父状态检查用户是否仍然自动登录任何子状态.它说,在文档中
子状态将从父状态继承已解析的依赖关系,它们可以覆盖它们.
我发现如果我从父级之外的状态进入任何子状态,父级依赖关系只会被重新解析,但如果在兄弟状态之间移动则不会.
在此示例中,如果在状态authroot.testA和authroot.testB之间移动,则只调用一次GetUser方法.当你移动到other状态并返回时,它将再次运行.
我能够将User依赖于每个子状态,以确保每次进入任何这些状态时都调用该方法,但这似乎会破坏继承依赖的目的.
我不正确地理解文档吗?有没有办法强制父状态重新解决其依赖关系,即使状态在兄弟姐妹之间发生变化?
<!doctype html>
<html>
<head>
<script src="https://cdnjs.cloudflare.com/ajax/libs/angular.js/1.2.1/angular.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/angular-ui-router/0.2.0/angular-ui-router.min.js"></script>
<script>
(function(ng) {
var app = ng.module("Test", ["ui.router"]);
app.config(["$stateProvider", "$urlRouterProvider", function(sp, urp) {
urp.otherwise("/testA");
sp.state("authroot", {
abstract: true,
url: "",
template: "<div ui-view></div>",
resolve: {User: ["UserService", function(UserService) {
console.log("Resolving dependency...");
return UserService.GetUser();
}]}
});
sp.state("authroot.testA", {
url: "/testA",
template: "<h1>Test A {{User|json}}</h1>",
controller: "TestCtrl"
});
sp.state("authroot.testB", {
url: "/testB",
template: "<h1>Test B {{User|json}}</h1>",
controller: "TestCtrl"
});
sp.state("other", {
url: "/other",
template: …Run Code Online (Sandbox Code Playgroud) 我正在尝试为包含的模板动态分配控制器,如下所示:
<section ng-repeat="panel in panels">
<div ng-include="'path/to/file.html'" ng-controller="{{panel}}"></div>
</section>
Run Code Online (Sandbox Code Playgroud)
但Angular抱怨说这{{panel}}是不确定的.
我猜,{{panel}}是不是定义尚未(因为我可以附和了{{panel}}在模板中).
我已经看到很多人设置ng-controller等于变量的例子如下:ng-controller="template.ctrlr".但是,如果没有创建重复的循环循环,我无法弄清楚如何{{panel}}在ng-controller需要时获得可用值.
PS我也尝试ng-controller="{{panel}}"在我的模板中设置(认为它必须已经解决),但没有骰子.
我是Angular和ui-router的新手.当有人选择模型并且我的控制器执行标准的SHOW方法时,我只想更新URL以包含模型的ID而不刷新页面,并继续我的原始视图.我不知道怎么做...
$stateProvider
.state('citylist', {
url: "/",
templateUrl: "views/index.html"
})
.state('cityshow', {
url: "/city/:id",
templateUrl: "views/index.html"
})
angular.module('app.system').controller('IndexController', ['$scope', 'Global', 'Cities', '$stateParams', '$location', function ($scope, Cities, $stateParams, $location) {
$scope.loadTown = function(id) {
Cities.get({id: id }, function(city) {
$scope.city = city
// Change URL
// Do things within the same view...
});
};
});
<button ng-click="loadTown(123456)">Chicago</button>
Run Code Online (Sandbox Code Playgroud)