Мой Angular 8 Resolver не вызывает.Загрузка страницы без получения данных - PullRequest
0 голосов
/ 20 сентября 2019

В моем проекте Angular 8 у меня есть такой маршрут.

app-routing.module.ts (с маршрутами и распознавателями) -> member-edit.resolver.ts (переопределенный метод разрешения сдоступ к accountService) -> member-edit.component.ts (пытается загрузить данные из резольвера в ngOnInit ())

Мой Resolver не вызывает, поэтому я не получаю никаких данных в ngOnInit ()

У меня такой же код в проекте Angular 6, и он отлично работает.Я не могу найти какое-либо решение, чтобы заставить его работать в моем проекте Angular 8.

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

Я пыталсяпонизить мой проект Angular 8, но я не добился успеха.У меня были некоторые проблемы с этим, и много ошибок.В противном случае это не было бы отличным решением.

Если бы я обратился к своему сервису, чтобы получить данные, они хорошо работают.Но когда я использую свой распознаватель, я не могу получить какие-либо данные.

Я замечаю, что в Angular 8 -> '@ angular / router' есть некоторые изменения по сравнению с Angular 6, но я не могу найти решение, которое можно исправитьЭто.(особенно ActivatedRoute)

My Angular 8 [ng v]: (не работает преобразователь)


    Angular CLI: 8.1.3
    Node: 10.16.0
    OS: win32 x64
    Angular: 8.1.3
    ... animations, cli, common, compiler, compiler-cli, core, forms
    ... language-service, platform-browser, platform-browser-dynamic
    ... router

    Package                           Version
    -----------------------------------------------------------
    @angular-devkit/architect         0.801.3
    @angular-devkit/build-angular     0.801.3
    @angular-devkit/build-optimizer   0.801.3
    @angular-devkit/build-webpack     0.801.3
    @angular-devkit/core              8.1.3
    @angular-devkit/schematics        8.1.3
    @angular/.compiler-cli.MODULES    <error>
    @angular/cdk                      8.1.2
    @angular/material                 8.1.2
    @ngtools/webpack                  8.1.3
    @schematics/angular               8.1.3
    @schematics/update                0.801.3
    rxjs                              6.4.0
    typescript                        3.4.5
    webpack                           4.35.2

My Angular 6 [ng v]: (resolver имеют данные)


    Angular CLI: 6.0.8
    Node: 10.16.0
    OS: win32 x64
    Angular: 6.1.10
    ... animations, common, compiler, compiler-cli, core, forms
    ... http, language-service, platform-browser
    ... platform-browser-dynamic, router

    Package                           Version
    -----------------------------------------------------------
    @angular-devkit/architect         0.6.8
    @angular-devkit/build-angular     0.6.8
    @angular-devkit/build-optimizer   0.6.8
    @angular-devkit/core              0.6.8
    @angular-devkit/schematics        0.6.8
    @angular/cli                      6.0.8
    @ngtools/webpack                  6.0.8
    @schematics/angular               0.6.8
    @schematics/update                0.6.8
    rxjs                              6.0.0
    typescript                        2.7.2
    webpack                           4.8.3

Хорошо, давайте начнем ..

Итак, обратите внимание на 3 файла:

member-edit.component.ts
member-edit.resolver.ts
app-routing.module.ts

"member-edit.component.ts:"

Вкл.В начале у меня есть member-edit.component.ts, и я сосредоточусь на методе ngOnInit (), выглядит так:


    ngOnInit() {
    this.registerForm = this.formBuilder.group({
      firstName: ['', Validators.required],
      secondName: ['', ],
      surname: ['', Validators.required]
    }, {});

     this.route.data.subscribe(data => {
      console.log('Check route resolver data');
      this.account = data.account;
      console.log(data);
      console.log(this.account);
    });
    }

Мой member-edit.resolver.ts выглядит следующим образом:


        @Injectable()
    export class MemberEditResolver implements Resolve<User> {
        constructor(private userService: UserService, private router: Router, private alertify: AlertifyService, private authService: AuthService) {}

        resolve(route: ActivatedRouteSnapshot): Observable<User> {
            return this.userService.getUser(this.authService.decodedToken.nameid).pipe(
                catchError(error => {
                    this.alertify.error('Problem with retriving your data.');
                    this.router.navigate(['/members']);
                    return of(null); // null ale jako observer
                })
            );
        }
    }

И файл маршрутизации:


        const routes: Routes = [
      { path: '', component: HomeComponent },
      {
        path: '', // localhost:4200/members etc..
        runGuardsAndResolvers: 'always',
        canActivate: [AuthGuard],
        children: [
          { path: 'home', component: HomeComponent },
          { path: 'thesis', component: ThesisComponent },
          { path: 'promoters', component: PromotersComponent },
          { path: 'groups', component: GroupsComponent },
          { path: 'messages', component: MessagesComponent },
          { path: 'help', component: HelpComponent },
          { path: 'adminPanel', component: AdminPanelComponent },
          { path: 'member/edit', component: MemberEditComponent },
          // { path: 'members', component: MemberListComponent, resolve: { users: MemberListResolver } },
          // { path: 'members/:id', component: MemberDetailComponent, resolve: { user: MemberDetailResolver } },
          {
            path: 'member/edit',
            component: MemberEditComponent,
            resolve: { account: MemberEditResolver }
          }
        ]
      },
      { path: '**', redirectTo: '', pathMatch: 'full' }
    ];

    @NgModule({
      imports: [RouterModule.forRoot(routes)],
      exports: [RouterModule],
      providers: [MemberEditResolver]
    })

    export class AppRoutingModule {}

Я немного расстроен, потому что понятия не имею, что мне еще делать.На Angular 6 все работает хорошо, но здесь, на 8, мой распознаватель не загружает никаких данных, поэтому у меня ничего нет:

this.account = data.account;

для целей отладки. Я использовал console.log, а этот получал вмой консольный объект только с __proto__ __

Что я должен сделать, чтобы загрузить данные из распознавателя?

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...