如何解决我能够在 angular 11 应用程序中发送发布请求,但如何检索特定输入值的数据
**check image question is listed**
<form #postForm="ngForm" (ngSubmit)="onCreatePost(postForm.value)">
<div class="form-group">
<label for="title">Title</label>
<input
type="text"
class="form-control"
id="title"
required
ngModel
name="marketname"
/>
onCreatePost(postData: { marketname: String }) {
this.http.post(url,postData).subscribe(response=>{
console.log(response)
})
我只能在浏览器控制台上打印发布请求
但是如何从具有 marketname="Web development" 的restapi 在浏览器上打印数据
解决方法
不确定我是否理解你所说的,但你在寻找这样的东西吗?
postForm: NgForm;
onCreatePost(postData: { marketname: string }) {
this.http.post(url,postData).subscribe(response=>{
console.log(response);
postForm.setValue({ marketname: response }); // Maybe response.marketname
});
}
,
如果你想形成如图所示的表格,你可以试试这个。将来自 api 的响应存储在变量 "data" 中,以便你可以在 HTML 中访问它。在表单后面写下下面的代码。
`
<form #postForm="ngForm" (ngSubmit)="onCreatePost(postForm.value)">
<div class="form-group">
<label for="title">Title</label>
<input
type="text"
class="form-control"
id="title"
required
ngModel
name="marketname"
/>
</div>
<button type="submit" >Search</button>
</form>
<ng-template *ngIf="data!=0">
<table>
<thead >
<tr>
<th scope="col">Market Name</th>
<th scope="col">Forecast Period</th>
<th scope="col">start Market Size</th>
<th scope="col">End Market Size</th>
<th scope="col">CAGR</th>
<th scope="col">Region</th>
<th scope="col">Currency</th>
<th scope="col">URL</th>
</tr>
</thead>
<tbody>
<tr *ngFor="let item of data">
<td>{{item.MarketName}}</td>
<td>{{item.ForecastPeriod}}</td>
<td>{{item.startMarketSize}}</td>
<td>{{item.EndMarketSize}}</td>
<td>{{item.CAGR}}</td>
<td>{{item.Region}}</td>
<td>{{item.Currency}}</td>
<td>{{item.Region}}</td>
</tr>
</tbody>
</table>
<ng-template>
`
版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。