防止ui-router状态控制器在使用params更改状态后重载

The following angular + ui-router app:

以下角+ ui-router应用:

var myapp = angular.module('myapp', ["ui.router"])
myapp.config(function($stateProvider, $urlRouterProvider){

  // For any unmatched url, send to /route1
  $urlRouterProvider.otherwise("/route1");

  $stateProvider
    .state("route1", {
        url: "/route1?x",
        templateUrl: "route1.html",
        controller: function($scope, $state){
          console.log("route 1");
          $scope.setUrlParam = function(p) {
            console.log("set x", p);
            $state.go('route1', {x: p}, {notify: false, location:'replace'})
          }
        }
    })
    .state('route2', {
        parent: "route1",
        url: "/route2",
        templateUrl: "route2.html",
        controller: function($scope){
          console.log("route 2");
          $scope.items = ["A", "List", "Of", "Items"];
        }
    })

})

...has two states, route1 and route2 which is a child of route1.

…有两个州，route1和route2是route1的孩子。

Plunker: http://plnkr.co/edit/3P9ZE1HvSgK24B1MrIf4?p=preview
砰砰作响:http://plnkr.co/edit/3P9ZE1HvSgK24B1MrIf4?p=preview
Click on "Live Preview" and open the console panel in your dev tools.
单击“Live Preview”并在开发工具中打开控制台面板。

Clicking on "Goto route 1" and "Goto route 2" will only trigger the run of Controller 2 when changing the state to route2 (Open the console to view) as expected.

点击“Goto route 1”和“Goto route2”只会在改变状态到route2(打开控制台以查看)时触发控制器2的运行。

However, my app needs to change some url params in route1 on various occasions (for example, when a user drags the map, we would like to change the url to reflect the coordinates in the url), but nothing else should happen. Checking out ui-router docs, the following is used to change the url params:

但是，我的应用程序需要在route1中更改一些url params(例如，当用户拖拽地图时，我们希望更改url以反映url中的坐标)，但是不应该发生任何其他事情。查看ui-router文档，以下内容用于更改url params:

$state.go('route1', {x: p}, {notify: false, location:'replace'})

This works great (for changing the url).

这非常有效(用于更改url)。

However, after using this technique, using $state.go('route2') triggers route1's controller reload! Try clicking on "set x to 123" and then on "goto route 2" on the demo.

然而，使用此技术后，使用$state.go('route2')触发route1的控制器重新加载!尝试点击“将x设置为123”，然后在演示中点击“goto route 2”。

How can I prevent the reloading route1's controller?

如何防止重新加载route1的控制器?

Any help would be appreciated!

如有任何帮助，我们将不胜感激!

Versions Used:

版本使用:

angular 1.2.4
角4
ui-router 0.2.15
ui-router 0.2.15

1 个解决方案

#1

try to add this in your state config

尝试在状态配置中添加这个

reloadOnSearch: false

and call the function below when you want update url

并在需要更新url时调用下面的函数

$location.search( { param: value } );

url should be able to update without reloading

url应该能够在不重新加载的情况下进行更新

hope this helps

希望这有助于

#1