2016-12-06 6 views
7

У меня есть три компонента, каждый из которых имеет свой собственный резольвер, который извлекает данные из другого API. Для этого эти компоненты полагаются на URL-адрес, который совместно используется с помощью службы.Angular2: Как обновить компоненты, зависящие от преобразователя?

Я хочу, чтобы, когда происходит изменение этого URL-адреса, каждый компонент перезагружается, то есть перезагружать преобразователи.

Я посмотрел на несколько связанных SO вопросов, но ни один не говоря уже о том, как сделать это при использовании арбитров, КФ: question 1, question 2, question 3

Я могу думать о двух способах:

Грязных образом : Принудительно обновить компонент, используя перенаправление маршрутизатора и пустой компонент.

this.router.navigateByUrl('blank',true); 
this.router.navigateByUrl('home/(mapps:mobil//sw:simil//sf:sales)'); 

Но это не сработало. Есть обновление, но резольверы не ... разрешены.

Другой способ: использовать BehaviorSubject или ChangeDetectorRef. Но тогда я не знаю, как этого добиться, учитывая, что обнаружение изменений внутри моих компонентов не поможет мне перезапустить ресиверы.

У меня такое ощущение, что это должно быть сделано через маршрутизатор как-то, потому что это один зная о резольверами:

const routes: Routes = [ 
    { 
    path: '', 
    redirectTo: 'home', 
    pathMatch: 'full' 
    }, 
    { 
    path: 'home', 
    component: HomeComponent, 
    children : [ 
     { 
     path: '', 
     component: BlankComponent 
     }, 
     { 
     path: 'simil', 
     component: SwComponent, 
     outlet: 'sw', 
     resolve: { 
      data: SwResolve 
     } 
     }, 
     { 
     path: 'sales', 
     component: SalesComponent, 
     outlet: 'sf', 
     resolve: { 
      data: SalesResolve 
     } 
     } 
    ] 
    }, 
    { 
    path: 'blank', 
    component: BlankComponent 
    } 
]; 

Любые намеки о том, как достичь этого?

Edit: Вот related plunkr

Edit 17 июня: Там нет необходимости для заготовки компонентов обходного пути больше. Чтобы обновить компоненты, просто перезвоните маршрут:

this.router.navigateByUrl('home/(mapps:mobil//sw:simil//sf:sales)')

+1

Пожалуйста, предоставьте информацию и [MCVE] (http://stackoverflow.com/help/mcve) о том, как вы используете арбитры. Когда маршрут вводится как «ActivatedRoute» (не «ActivatedRouteSnapshot»), «данные» могут быть подписаны, как показано [здесь] (https://angular.io/docs/ts/latest/guide/router.html #! # выборки-данных, прежде чем-навигации). – estus

+0

@estus Добавлен подробный plunkr. Link демонстрирует использование ActivatedRouteSnapshot, который я уже использую. – Stanislasdrg

+0

Хорошо, я вижу. И где перенаправление, которое должно обновить резольверы, должно произойти в этом плунге? – estus

ответ

9

Это в настоящее время невозможно обновить маршруты. Вероятно, это можно будет сделать with RouteReuseStrategy in Angular 2.3.

Резольверы переоцениваются, когда маршрут изменяется и может наблюдаться от ActivatedRoute. Они не переоцениваются, если маршрут остается неизменным (параметр не изменяется) и должен быть спроектирован соответствующим образом.

изменение маршрута является асинхронным, обходной путь к изменениям маршрута цепи:

this.router.navigateByUrl('blank').then(() => { 
    this.router.navigateByUrl('home/(mapps:mobil//sw:simil//sf:sales)'); 
}) 
+0

Спасибо, он, наконец, работает! Я заслуживаю facepalm для того, чтобы не заметить изменение маршрута асинхронно. Похоже, это самое простое решение до сих пор, так как мои решатели не принимают никаких параметров маршрута. – Stanislasdrg

+0

Добро пожаловать, рад, что это работает – estus

Смежные вопросы