AngularJS UI路由器：重装：真还重载父状态 [英] AngularJS ui-router: reload:true also reloads parent state

问题描述

在这个普拉克你有两个UI路由器的状态，父和一个小孩。当孩子被点击的链接，因为它有选择重载调用：真正的它总是被重新加载。这是好的，但问题是父状态重载为好。试着点击填充11'链接几次，你会看到父时间戳也改变。

我怎样才能重新加载只有孩子？

使用Javascript：

  VAR应用= angular.module（应用程序，['ui.router']）;的app.config（函数（$ stateProvider，$ urlRouterProvider）{  $ urlRouterProvider.otherwise（/）;  $ stateProvider
    .STATE（'STATE1'，{
          templateUrl：state1.html'，
          控制器：函数（$范围）{            $ scope.theTime1 = Date.now（）;          }
    }）
    .STATE（'state1.state11'，{
          templateUrl：state11.html'，
          控制器：函数（$范围）{               $ scope.theTime11 = Date.now（）;         }
    }）;}）;
 

解决方案

这其实很简单。

不要使用重新加载，因为已经做了你发现了什么。这一切都重新加载的路径。

相反，一个参数添加到您的孩子的路线，每一个链接被点击确认更改参数的时间。这将迫使孩子的状态重新加载。

我用一个例子来更新您的普拉克。我只是增加了一个 NUM 参数并增加计数每个链接被点击时可变的。

<一个href=\"http://plnkr.co/edit/qTA39rrYFYUegzuFbWnc?p=$p$pview\">http://plnkr.co/edit/qTA39rrYFYUegzuFbWnc?p=$p$pview

In this plunk you have two ui-router states, a parent and a child. When the child is invoked by clicking on the link, since it has the option reload: true it is always reloaded. This is fine, but the problem is that the parent state is reloaded as well. Try to click on the 'Populate 11' link several times and you'll see that the parent timestamp also changes.

How can I reload only the child?

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();

         }
    });

});

解决方案

It's actually very simple.

Don't use reload because that does exactly what you found. It reloads everything for the route.

Instead, add a parameter to your child route and every time the link is clicked make sure to change that parameter. That will force the child state to be reloaded.

I updated your plunk with an example. I just added a num parameter and increase a count variable each time the link is clicked.

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

这篇关于AngularJS UI路由器：重装：真还重载父状态的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！