Как я могу обновить $stateParams без перезагрузки ui-view? angular ui router

Получите контекст, angular, ui-router, ничего особенного, корневой вид, построенный с использованием трех названий ui-views. поэтому в index.html имеем

<body>
  <div ui-view='left'>
  <div ui-view='center'>
  <div ui-view='right'>
</body>

мой маршрут выглядит как

$stateProvider
 .state('main', {
  url: '/',
  views: {
   'left': {templateUrl: 'foo.html'},
   'center': {templateUrl: 'bar.html'},
   'right': {templateUrl: 'xyz.html'}
  }
 })
 .state('main.b', {
  url: '/b',
  params: { foo: {value: 'bar'} }
  views: { '[email protected]': {templateUrl: '123.html'} } // I wish to update $stateParams in '[email protected]' view
 })
 .state('main.c', {
  url: '/c',
  params: ...
  views: { '[email protected]': ..., '[email protected]': ..., '[email protected]': .. }
 });

Есть ли способ перейти в состояние b для обновления $stateParams в режиме "center" и "left"? Я могу получить его с помощью службы, но мне нужно добавить $watch в переменную, которая мне нужна, и она выглядит немного взломанной для меня.

Переходя в состояние c, я могу получить то, что хочу, но представление перезагружается, и я хочу избежать этого поведения, потому что у меня есть холст в "левом" представлении.

Ответы

Ответ 1

Вы можете использовать следующее, чтобы перейти на конкретный маршрут без перезагрузки просмотров:

$state.go('.', {parm1: 1}, {notify: false});

Последний литерал объекта представляет параметры, которые вы можете передать в go. Если вы установите notify на false, это фактически предотвратит повторное инициализацию контроллеров. . в начале - это имя абсолютного состояния или относительный путь состояния, к которому вы хотите перейти.

Важно, однако, notify.

Ответ 2

Цитата @christopherthielen из https://github.com/angular-ui/ui-router/issues/1758#issuecomment-205060258:

используя уведомление: false почти никогда не является хорошей идеей, и теперь осуждается. Используйте reloadOnSearch, если нужно.

Вы также можете попробовать динамические параметры в версии 1.0 (в настоящее время 1.0.0-alpha.3). В своем состоянии настройте параметр как динамический и реализуйте обратный вызов uiOnParamsChanged:

.state('foo', {
  url: '/:fooId',
  params: { fooId: { dynamic: true } },
  controller: function() {
    this.uiOnParamsChanged = function(changedParams, $transition$) {
      // do something with the changed params
      // you can inspect $transition$ to see the what triggered the dynamic params change.
    }
  }
});

Для демонстрации посмотрите на этот плункер: http://plnkr.co/edit/T2scUAq0ljnZhPqkIshB?p=preview

Ответ 3

Я думаю, что использование "Динамических параметров" теперь является лучшим решением:

Когда динамическое значение истинно, изменения значения параметра не приводят к вводу/выходу состояния. Решения не будут повторно загружены, и просмотры не будут перезагружены.

$stateProvider.state('search', {
   url: '/search?city&startDate&endDate',
   templateUrl: 'some/url/template.html',  
   params: {
      city: {
         value: 'Boston',
         dynamic: true
      }
   }
 }

а затем:

$state.go('.', {city: 'London'});

https://ui-router.github.io/ng1/docs/latest/interfaces/params.paramdeclaration.html#dynamic https://github.com/angular-ui/ui-router/issues/2709