何时从服务器返回JSON响应?如何将返回的数据提取到Angular 6的文本框中?
根据要求,我附上了以下代码!请好好研究一下!
Component.html
<app-modal-basic #modalDefault>
<div class="app-modal-header">
<h4 class="modal-title"> {{ brandname }} Details</h4>
<button type="button" class="close basic-close" (click)="modalDefault.hide()">
<span aria-hidden="true">×</span>
</button>
</div>
<div class="app-modal-body">
<div class="container">
<form>
<div class="form-group row">
<label for="brand" class="col-sm-3 col-form-label font-weight-bold">Brand ID</label>
<div class="col-sm-5">
<input type="text" class="form-control" value="{{brand.brandId}}" id="brand" minlength="3" readonly>
</div>
</div>
<div class="form-group row">
<label for="brand" class="col-sm-3 col-form-label font-weight-bold">Brand</label>
<div class="col-sm-5">
<input type="text" name="brandname" value="{{brand.brand}}" class="form-control" id="brand" minlength="3" >
</div>
</div>
</form>
</div>
</div>
<div class="app-modal-footer">
<button type="button" class="btn btn-default waves-effect" (click)="modalDefault.hide()">Close</button>
<button type="button" class="btn btn-primary waves-effect waves-light ">Update</button>
</div>
</app-modal-basic>
TS文件
findybrandid(brandid: number) {
this.brandService.getbrandid(brandid)
.subscribe(data => console.log(data),
error => console.log(error));
}
答案 0 :(得分:0)
在您的代码上未将服务返回值分配给您的品牌对象。
findybrandid(brandid: number) {
this.brandService.getbrandid(brandid).subscribe(
data => this.brand = data, // like this
error => console.log(error));
}
请 提供一些代码以更好地理解。 无论如何,按照我的解释。
我想您将使用一种服务来检索API数据。 在使用中,您会遇到以下情况:
getClient(): Observable<Cliente> {
return this.http.get<Cliente>(`${this.url}/client/1`)
}
此方法返回组件的Observable对象。在componente中,您可以执行以下操作:
getClient() {
this.clienteService.getClient().subscribe(
res => {
this.cliente = res; // add service return to your attribute
},
err => {
console.log(err);
}
)}
这样,您可以获取服务响应数据并分配给文本框:
<input type="text" name="name" value="{{cliente.name}}" />
This guide详细说明如何在Angular中显示数据。