从服务中填写反应式初始数据

Question

使用 Angular 7 和 Reactive 表单我在组件上有以下内容：

ngOnInit() {

  this.postForm = this.formBuilder.group({ 
    categoryId: [''],  
    title: [''],
    content: ['']
  });

}

getPost(postId: number) : Observable<Post> {

  return this.postService.getByPostId(postId);

}

其中PostService的GetByPostId方法如下：

public getByPostId(postId: number): Observable<Post> {

  return this.httpClient.get<Post>(`posts/${postId}`);

}

postServicereturns一个Post哪个接口是：

interface Post {
  id: number;
  categoryId: number;
  title: string;
  content: string;
}

填写表单数据的正确方法是什么 Post returns?

Answer 1

最好的方法是使用 patchValue 方法：

updateProfile() {
 this.profileForm.patchValue({
    firstName: 'Nancy',
    address: {
      street: '123 Drew Street'
    }
  });
}

更多信息：here

从服务中填写反应式初始数据

Fill reactive form initial data from service

angular

angular-reactive-forms

angular7