AngularJS UI 路由器 : reload:true also reloads parent state

Question

In this plunk你有两个 ui-router 状态，一个父状态和一个子状态。当通过单击链接调用子级时，由于它具有选项 reload: true，因此它始终会重新加载。这很好，但问题是父状态也会重新加载。尝试多次单击“填充 11”链接，您将看到父时间戳也发生了变化。

如何只重新加载子进程？

Javascript:

var app = angular.module("app", ['ui.router']);

app.config(function($stateProvider, $urlRouterProvider) {

  $urlRouterProvider.otherwise("/");

  $stateProvider
    .state('state1', {
          templateUrl: 'state1.html',
          controller: function($scope) {

            $scope.theTime1 = Date.now();

          }
    })
    .state('state1.state11', {
          templateUrl: 'state11.html',
          controller: function($scope) {

               $scope.theTime11 = Date.now();

         }
    });

});

Answer 1

其实很简单。

不要使用reload，因为它的作用正是您所发现的。它会重新加载路线的所有内容。

相反，请向您的子路由添加一个参数，并且每次单击该链接时，请确保更改该参数。这将强制重新加载子状态。

我用一个例子更新了你的想法。我刚刚添加了一个 num 参数，并在每次单击链接时增加一个 count 变量。

http://plnkr.co/edit/qTA39rrYFYUegzuFbWnc?p=preview