UI-Router-изменение $state без перезапуска / перезагрузки страницы

Я смотрел на эти страницы (1, 2, 3). Я в основном хочу изменить свой $state, но я не хочу, чтобы страница перезагрузилась.

Я в настоящее время на странице /schedules/2/4/2014, и я хочу перейти в режим редактирования, когда я нажимаю кнопку и URL-адрес становится /schedules/2/4/2014/edit.

мой edit государство просто $scope.isEdit = true, поэтому нет смысла перезагружать всю страницу. Тем не менее, я хочу $state и/или url изменить таким образом что если пользователь refreshses страницы, он начинается в режиме редактирования.

что я могу сделать?

34
angular-ui-router angularjs

2 ответов

для этой проблемы вы можете просто создать дочернее состояние, которое не имеет ни templateUrl, ни controller и вперед между states обычно:

// UPDATED
$stateProvider
    .state('schedules', {
        url: "/schedules/:day/:month/:year",
        templateUrl: 'schedules.html',
        abstract: true, // make this abstract
        controller: function($scope, $state, $stateParams) {
            $scope.schedDate = moment($stateParams.year + '-' + 
                                      $stateParams.month + '-' + 
                                      $stateParams.day);
            $scope.isEdit = false;

            $scope.gotoEdit = function() {
                $scope.isEdit = true;
                $state.go('schedules.edit');
            };

            $scope.gotoView = function() {
                $scope.isEdit = false;
                $state.go('schedules.view');
            };
        },
        resolve: {...}
    })
    .state('schedules.view', { // added view mode
        url: "/view"
    })
    .state('schedules.edit', { // both children share controller above
        url: "/edit"
    });

важным концепция вот, что в ui-router, когда приложение находится в определенном состоянии-когда состояние "активно"-все его предковые состояния также неявно активны.

Итак, в данном случае,

  • когда приложение переходит из режима просмотра в режим редактирования, его родительское государство schedules (вместе с templateUrl, controller и даже resolve) сохранятся.
  • поскольку состояния предков неявно активируются, даже если дочернее состояние обновляется (или загружается непосредственно из закладки), страница будет отображаться правильно.
20
20