Angularjs ui路由器正在重新加载控制器

使用ui路由器1.0.6

每次我返回url（使用ui sref）时，它都会重新加载控制器。我希望避免这种情况，并且只在第一次访问控制器时加载它

---

在本例中：每次我在Hello和About之间反复切换时，都会记录控制台。

有一个ui路由器插件可以做到这一点，名为sticky states:

我会在你的plunker上构建，但我找不到一个承载粘性状态的CDN。我发现了一个用于ui路由器extras的CDN，它相当于ui路由器0.x中的粘性状态，但对于1.x，它不起作用

你需要做的是

1） 添加插件。粘性状态的github页面给出了如何执行此操作的说明，我将在此处复制：

import {StickyStatesPlugin} from "ui-router-sticky-states";

angular.module('myapp', ['ui.router']).config(function($uiRouterProvider) {
  $uiRouterProvider.plugin(StickyStatesPlugin);
});

2） 对于要保持活动状态的状态定义，请添加属性

sticky:true

，如中所示：

var aboutState = {
  name: 'about',
  url: '/about',
  template: '<h3>Its the UI-Router hello world app!</h3>',
  controller : 'ModuleOneCtrl',
  sticky: true
}

var aboutState={
姓名：'关于'，
url:“/关于”，
模板：“这是UI路由器hello world应用程序！”，
控制器：“ModuleOneCtrl”，
斯蒂奇：是的
}

使用此标志，从一个状态移动到兄弟状态将不会退出旧状态，而是将其“停用”。控制器保持加载状态。如果您尝试进入该旧状态，它将被“重新激活”。该状态现在处于活动状态，但重用现有控制器

请注意，如果执行以下操作之一，粘性状态仍将退出：

1） 退出粘性状态的父级
2） 直接激活粘性状态的父级

---

因此，您需要安排您的状态树，使其不会发生，或者仅在您希望的时候发生。

有一个ui路由器插件可以做到这一点，名为sticky states:

我会在你的plunker上构建，但我找不到一个承载粘性状态的CDN。我发现了一个用于ui路由器extras的CDN，它相当于ui路由器0.x中的粘性状态，但对于1.x，它不起作用

你需要做的是

1） 添加插件。粘性状态的github页面给出了如何执行此操作的说明，我将在此处复制：

import {StickyStatesPlugin} from "ui-router-sticky-states";

angular.module('myapp', ['ui.router']).config(function($uiRouterProvider) {
  $uiRouterProvider.plugin(StickyStatesPlugin);
});

2） 对于要保持活动状态的状态定义，请添加属性

sticky:true

，如中所示：

var aboutState = {
  name: 'about',
  url: '/about',
  template: '<h3>Its the UI-Router hello world app!</h3>',
  controller : 'ModuleOneCtrl',
  sticky: true
}

var aboutState={
姓名：'关于'，
url:“/关于”，
模板：“这是UI路由器hello world应用程序！”，
控制器：“ModuleOneCtrl”，
斯蒂奇：是的
}

使用此标志，从一个状态移动到兄弟状态将不会退出旧状态，而是将其“停用”。控制器保持加载状态。如果您尝试进入该旧状态，它将被“重新激活”。该状态现在处于活动状态，但重用现有控制器

请注意，如果执行以下操作之一，粘性状态仍将退出：

1） 退出粘性状态的父级
2） 直接激活粘性状态的父级

---

因此，您需要安排您的状态树，以便它不会发生，或者只在您希望时发生。

它可以包装在父控制器中，以跟踪已加载的用户

以下是一个工作示例：

基本上，您可以创建另一个控制器，该控制器包含一个空列表的对象：

myApp.controller('ModuleNumCtrl', function() {
  loadedCtrl = {};
});

通过将abstract属性设置为true，将其设置为：

var parentState = {
  abstract: true,
  name: 'parent',
  controller: 'ModuleNumCtrl'
};

<a ui-sref="parent.hello" ui-sref-active="active">Hello</a>
<a ui-sref="parent.about" ui-sref-active="active">About</a>

然后，通过在退出控制器的名称前面加上“父”前缀，将其设置为其子控制器。

var helloState = {
  name: 'parent.hello',
  url: '/hello',
  template: '<h3>hello world!</h3>',
  controller: 'ModuleTwoCtrl'
};

var aboutState = {
  name: 'parent.about',
  url: '/about',
  template: '<h3>Its the UI-Router hello world app!</h3>',
  controller: 'ModuleOneCtrl'
};

$stateProvider.state(parentState);
$stateProvider.state(helloState);
$stateProvider.state(aboutState);

最后一件事，不要忘记用新的控制器名称更改HTML：

var parentState = {
  abstract: true,
  name: 'parent',
  controller: 'ModuleNumCtrl'
};

<a ui-sref="parent.hello" ui-sref-active="active">Hello</a>
<a ui-sref="parent.about" ui-sref-active="active">About</a>

你好 关于

---

它可以包装在父控制器中，以跟踪已加载的用户

以下是一个工作示例：

基本上，您可以创建另一个控制器，该控制器包含一个空列表的对象：

myApp.controller('ModuleNumCtrl', function() {
  loadedCtrl = {};
});

通过将abstract属性设置为true，将其设置为：

var parentState = {
  abstract: true,
  name: 'parent',
  controller: 'ModuleNumCtrl'
};

<a ui-sref="parent.hello" ui-sref-active="active">Hello</a>
<a ui-sref="parent.about" ui-sref-active="active">About</a>

然后，通过在退出控制器的名称前面加上“父”前缀，将其设置为其子控制器。

var helloState = {
  name: 'parent.hello',
  url: '/hello',
  template: '<h3>hello world!</h3>',
  controller: 'ModuleTwoCtrl'
};

var aboutState = {
  name: 'parent.about',
  url: '/about',
  template: '<h3>Its the UI-Router hello world app!</h3>',
  controller: 'ModuleOneCtrl'
};

$stateProvider.state(parentState);
$stateProvider.state(helloState);
$stateProvider.state(aboutState);

最后一件事，不要忘记用新的控制器名称更改HTML：

var parentState = {
  abstract: true,
  name: 'parent',
  controller: 'ModuleNumCtrl'
};

<a ui-sref="parent.hello" ui-sref-active="active">Hello</a>
<a ui-sref="parent.about" ui-sref-active="active">About</a>

你好 关于

---

此解决方案是否每次都重新初始化控制器的范围？我想避免这种情况。父控制器不会每次都重新初始化，因此您可以将代码和任何要保存的数据放在父控制器上，并仅从子控制器触发一次，这是我能想到的最简单的解决方案。有了这个解决方案，控制器每次都会重新初始化吗？我想避免这种情况。父控制器不会每次都重新初始化，这样你就可以将代码和任何你想保存的数据放在父控制器上，并且只从子控制器触发一次，这是我能想到的最简单的解决方案。