Angular/UI-Router - Как обновить URL-адрес без обновления всего?

Я новичок как для Angular, так и для ui-router. Когда кто-то выбирает модель, и мой контроллер выполняет стандартный метод SHOW, я просто хочу обновить URL-адрес, чтобы включить идентификатор модели без обновления страницы, и продолжить свое первоначальное представление. Я не уверен, как это сделать...

$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>

Ответы

Ответ 1

Фрагменты кода, которые вы использовали, немного далеки от правильных настроек ui-router. Я бы предложил вам проверить это демо-приложение: http://angular-ui.github.io/ui-router/sample/#/contacts/1. Здесь мы видим, как List является "фиксированным", а Detail изменен без обновления страницы.

Код этого примера скачать здесь https://github.com/angular-ui/ui-router/tree/master/sample.

Что должно помочь много понять, КАК (кроме wiki) был этот фрагмент кода: state.js. Загрузите демоверсию, прочитайте это комментарий. И ui-router будет иметь смысл...