Angular 9：使用相同的组件进行用户创建和用户编辑答案

【问题标题】：Angular 9: Using same component for user creation and user editingAngular 9：使用相同的组件进行用户创建和用户编辑
【发布时间】：2020-08-27 00:34:02
【问题描述】：

如何将单个组件同时用于编辑和创建？

表格将是 1:1 相同的。

我的编辑组件订阅 url id 参数的更改，并相应地获取用户项：

user: User;

constructor(private httpHandler: HttpHandlerService,
          private route: ActivatedRoute) {
}

ngOnInit(): void {
    this.route.params.subscribe(params => {
       this.httpHandler.getUser(userId)
         .subscribe(user => this.user = user);
    });
}

创建（新用户）时不应发生这种情况。我想使用一个空的用户对象而不订阅任何东西。

我应该简单地检查路线参数吗？还是有更好的方法？

【问题讨论】：

标签： angular angular2-routing

【解决方案1】：

通过检查 :id 参数来区分我的组件是处于“创建”还是“更新”模式来解决。

      user: User;
      idParam: string;
    
      ngOnInit(): void {
        this.route.params.subscribe(params => {
          this.idParam= params[`id`];
          if (!!this.idParam) {
                this.httpHandler.getUser(idParam)
                     .subscribe(user => this.user = user);
            } else {
              this.user = {
                id: '',
                name: ''
              };
          }
        });
      }

【讨论】：