Question

技术：Angular 7

我试图订阅httpClient.post，并在 subscribe 中将响应分配给我的本地模型，并且在Angular HTML模板中使用该本地模型来显示服务器响应值

在HTML模板中，模型属性为空，并且在订阅之后未显示分配的服务器响应。

但是，在订阅内的控制台中，我可以打印模型值

我的控制器代码段：

constructor(private httpClient:HttpClient){
this.mymodel = new MyModel();
}

onSubmit() {
this.submitted = true;
// this.mymodel.success  = false; //this.mymodel is my model object
if (this.form.invalid) { //reactive form
  return;
} else {
 const result: model= Object.assign({}, this.form.value);
this.httpClient.post<MyModel>('http://myservice/url/api', result)
.subscribe(
  response => {  this.mymodel = response;
  console.log(this.mymodel.firstname) //this is printing the server response value 
  }
  );
}

}

我的模板（HTML）代码段：

<body>
<p>{{mymodel.firstname}}</p>
<p>{{mymodel.lastname}}</p>

注意：相同的代码在Angular 5中可以正常工作。

我在这里做错什么，我的代码中缺少什么。任何帮助是极大的赞赏。

注意：经过编辑，以前我没有在模板中添加{{。

Answer 1

将其更改为：

<p>{{mymodel?.firstName}}</p> <!--{{mymodel?.firstname}}-->
<p>{{mymodel?.lastName}}</p>

您没有将值绑定到TS部分中声明的内容
检查您的模型是firstname还是firstName，不能同时使用。
将服务与组件分开，创建其他可注入类（services =具有@Injectable()的类），并将它们注入组件中。在中，一旦调用内部方法，则应订阅它们。 / li>

Angular 7中无法访问Angular 7 httpClient.post订阅数据

1 个答案: