Question

我正在尝试使用UI路由器来管理我的应用中的状态更改。我认为在动态路由上更改状态会导致当前作用域被销毁，并且为新模板重新插入新模板，例如：

$stateProvider
  .state('foo', {
    url: '/:id'
    views: {
      'foo@': {
        templateUrl: 'partials/foo.html',
        controller: 'Foo',
        controllerAs: 'FooCtrl as foo'
      }
    }
  });

我认为上面的状态会破坏＆amp;每次用户导航到具有不同ID的路由时，都会创建FooCtrl。因此，在每个路由上运行位于FooCtrl中的初始化函数，以使用来自注入控制器的服务的正确数据初始化当前视图。我一直在我的控制器中监听$scope.$destroy函数在这些状态变化上运行，但它们没有被调用。

我很好奇的是，创造和创造的惯用方法是什么？销毁控制器以获得我上面描述的功能？另外，在AngularJS中是否有更惯用的方法来实现同样的目的？

谢谢！

更新为了在使用$state.go()时销毁和重新创建控制器，您必须将{reload: true}选项作为第3个参数传递，如下所示。

$state.go('foo', {id: '1'}, {reload: true})

正如Radim所说，不需要调用{reload: true}来重新实例化控制器。目前，我正在监听$stateChangeStart以确保状态实际上正在更新。在看到它之后，我正在听$scope.$on('$destroy')并且它没有开火。所以出于某种原因，状态正在改变，而控制器没有被破坏。重新实例化。

更新工作 我犯的错误是在我最深的嵌套视图中，我使用的是绝对路径。这似乎使控制器从一个州到另一个州。当我创建相对的嵌套视图时，它们正在被销毁并在状态更改时重新创建，如Radim所描述的那样。

Answer 1

有a working plunker。默认情况下，UI-Router正在执行您所期望的操作。它是在每个更改状态上重新实例化控制器，即使只是参数（id）被更改

我只是稍微调整了上面的状态定义：

  // instead of this
  .state('/:id', {
      views: {
        'foo@': {
          templateUrl: 'partials/foo.html',
          controller: 'Foo',
          controllerAs: 'FooCtrl as foo'
        }
      }
    })

  // wee need this
  .state('myState', {
      url: '/:id',
      views: {
        'foo@': {
          templateUrl: 'partials/foo.html',
          controller: 'FooCtrl',
          controllerAs: 'foo'
        }
      }
    })

当我们使用不同的 FooCtrl

导航到状态'MyState'时，此id会登录到控制台

// register controller
.controller('FooCtrl', FooCtrl)

// this function will be our controller, called any time new id is passed
function FooCtrl($scope, $stateParams) {
    console.log('init with id: ' + $stateParams.Id + ', state params:')
    console.log($stateParams)

    var foo = {};
    foo.$stateParams = $stateParams
    return foo;
};

FooCtrl.$inject = ['$scope', '$stateParams'];

在action here

中查看

如何惯用，手动销毁范围＆amp;在AngularJS中重新创建它？

1 个答案: