Возвращает разрешенные данные из канала Angular 4, используя тему поведения

#angular #typescript #http #angular-routing #angular-services

#angular #typescript #http #angular-маршрутизация #angular-services

Вопрос:

Мой сервис: DetailService.ts

Отправить подробную информацию()

 sendDetail(id: number) {
    console.log("Snd trandetail");

    const url = this.rootUrl   'api/Details/Select?ID='   id;

    this.http.get(url).pipe(
      retry (3)
    ).toPromise()
    .then((data: any) => {
        this.detailSubject.next(data.Entity);
    });
}
  

GetDetail()

 getDetail() {
    console.log("Get trandetail");
    console.log(this.detailSubject);
    return this.detailSubject;
}
  

Мой распознаватель:

Resolver.ts

 resolve(route:ActivatedRouteSnapshot, state:RouterStateSnapshot): Observable<any> {
    return this.DetailService.getDetail()
        .pipe(
            map(object => 
            {
                console.log(object); //Data is fetched  here and printed
                return object;           
            })
        );
}
  

Маршрут к дочернему компоненту:

 {
  path: 'edit/:state',
  component: DetailComponent,
  data: {
    text: 'edit',
    nav: true,
    breadcrumbs: true
  },

  resolve: {
    object: Resolver
  },
  canActivate: [AuthGuard]

},

 providers: [ Resolver, DetailService ]
  

Маршрут к родительскому модулю:

  {
      path: 'detailsModule',
      loadChildren: 'app/layout/Details/some- 
 details/some-details.module#SomeDetailsModule',
      data: {
          preload: false,
          text: 'trans Amendment'
       },
       canActivate: [AuthGuard]
 },
  

Проблема:
Похоже, что мой маршрут не ведет к компоненту. Если я включаю трассировку, я обнаруживаю, что ResolveEnd не запускается.
Вот как я вызываю службу в компоненте:

 ngOnInit() {
  console.log("Object from Route");
  console.log(this.route.snapshot.data['object']);   
  this.object = this.route.snapshot.data['object'];
}
  

Где я ошибаюсь? Буду признателен за любую помощь. Спасибо!

Комментарии:

1. где subscribe() ? И что вы на самом деле хотите сделать?

2. @j4rey Я использую Pipe() и Map() для извлечения данных и пытаюсь разрешить данные при навигации.

3. Можете ли вы объяснить свою логику, которую вы пытаетесь реализовать здесь? Я вижу, что ваш распознаватель подключен к detailSubject и sendDetail() выдает значение. Дело в том, что распознаватель запускается при достижении маршрута и до создания компонента. Итак, тот факт, что даже если вы выдаете значение, ничего не делает. Вы пытаетесь загрузить тот же компонент с обновленными данными или пытаетесь открыть новый компонент с object данными?

4. можете ли вы создать пример в stackblitz? так будет проще отлаживать

Ответ №1:

Решил это. Причина, по которой не запускался ResolveEnd, заключалась в том, что я пропустил ` this.tranDetailSubject.complete(); в Send Details() сразу после next().

SendDetail():

 sendDetail(id: number) {
console.log("Snd trandetail");

const url = this.rootUrl   'api/Details/Select?ID='   id;

this.http.get(url).pipe(
  retry (3)
).toPromise()
.then((data: any) => {
    this.detailSubject.next(data.Entity);
    this.detailSubject.complete(); //Tells compiler to trigger ResolveEnd because observable is complete now.

});
}
  

`