2

我坚持将对象传递给 Angular 9/10 中的解析器。任何帮助将不胜感激。

我有一个页面SearchUser.component.ts,我从中导航到另一个页面UserInfo.component.ts。我试图在解析器中传递对象,它可以使用用户对象模型执行我的服务。

A) SearchUser.component.ts

viewUser() {
    /*Data to be posted before the User info page is displayed*/
    let data = {
        "UserId": 1 "UserName": "David",
        "Department": "Physics"

    }

    /*STEP_1 Payload on the router*/
    const navigationExtra: NavigationExtras = { state: data };
    this.router.navigate(['Default/ApplicationDisplay', navigationExtra]);
}

B)resolve-user.guards.ts
(在第 2 步,我期待可以在 API 上发布的数据)。但它显示空值。

import { Injectable } from '@angular/core';
import { CanActivate, ActivatedRouteSnapshot, RouterStateSnapshot, UrlTree, Resolve, Router } from '@angular/router';
import { Observable } from 'rxjs';
import { MyUserService } from '../services/my-user.service';

@Injectable({
    providedIn: 'root'
})
export class ResolveApplicationDetailsGuard implements Resolve < userList > {
    private postData: any;
    constructor(private _myUserService: MyUserService, private router: Router) {
        this.postData = router.getCurrentNavigation().extras.state; //STEP_2 
    }

    resolve(route: ActivatedRouteSnapshot, state: RouterStateSnapshot): Observable < userList > | Promise < userList > | userList {
        return this._myUserService.GetUsersData(this.postData);
    }

}

UserInfo.component.ts

getUserInfo() {
    //STEP_3
    this.activatedRoute.snapshot.data['userList'];
}

应用程序路由.ts

path: 'UserInfo',
    component: UserInfoComponent,
    resolve: {
        userList: UserInfoGuard
    }

感谢是否有人能指出我正确的方向,因为我肯定错过了一些东西。

4

2 回答 2

2

我读对了吗 -let data不在同一个范围内(它在viewUser方法内部)const navigationExtra

如果navigationExtra是 outsieviewUser 方法,则不能这样做{state:data},因为在此范围内无法访问数据。您必须分配data给组件自己的属性,然后navigationExtra像这样声明 const :

navigationExtra: NavigationExtras = {state: this.data}; 
于 2020-10-07T09:01:02.647 回答
1

您可以按照以下步骤操作:

通过 Angular 中的路由路径发送数据

我不确定,但您可以尝试在此行末尾添加数据。

this.postData = router.getCurrentNavigation().extras.state.data;
于 2020-10-07T09:17:20.757 回答