Angular/UI-Router - 如何在不刷新所有内容的情况下更新URL？

Question

我是Angular和ui-router的新手.当有人选择模型并且我的控制器执行标准的SHOW方法时,我只想更新URL以包含模型的ID而不刷新页面,并继续我的原始视图.我不知道怎么做...

$stateProvider
        .state('citylist', {
          url: "/",
          templateUrl: "views/index.html"
        })
        .state('cityshow', {
          url: "/city/:id",
          templateUrl: "views/index.html"
        })

angular.module('app.system').controller('IndexController', ['$scope', 'Global', 'Cities', '$stateParams', '$location', function ($scope, Cities, $stateParams, $location) {

    $scope.loadTown = function(id) {
        Cities.get({id: id }, function(city) {
             $scope.city = city
             // Change URL
             // Do things within the same view...
        });
    };
});

<button ng-click="loadTown(123456)">Chicago</button>

Answer 1

您使用的代码段与正确的ui-router设置相差甚远.我建议你查看这个演示应用程序:http://angular-ui.github.io/ui-router/sample/#/contacts/1.在这里,我们可以看到如何在没有任何页面刷新的情况下更改细节时如何"修复" 列表.

这个例子的代码在这里下载https://github.com/angular-ui/ui-router/tree/master/sample.

什么应该有很多帮助理解如何(除了维基)是这段代码片段:state.js.加载演示,阅读此注释说明.并且ui-router会有意义......