将对象作为选择角度中的参数传递
我试图在选择中使用 Angular 9.0.7 将对象作为参数传递。
代码如下:
<div *ngIf="foundAddresses == true">
<label class="bold">Select Address</label>
<select [ngClass]="{'error-message' : orderForm.controls['address'].touched && orderForm.controls['address'].hasError('required')}" (change)="updateAddress($event.target.value)" formControlName="address" class="titlewidth bottomspacing findAddressSelect">
<option>Please select</option>
<option *ngFor="let address of addresses" value="{{address}}">
{{address.summaryline}}
</option>
</select>
</div>
地址是一个对象数组,其中地址是包含不同键值对的对象。数组中对象条目的示例如下所示:
{
"addressline1": "1 Heol Dolwen",
"summaryline": "1 Heol Dolwen, Cardiff, South Glamorgan, CF14 1RX",
"number": "1",
"premise": "1",
"street": "Heol Dolwen",
"posttown": "Cardiff",
"county": "South Glamorgan",
"postcode": "CF14 1RX",
"recodes": "CF4 1RX:1A:199812"
},
我试图获取如下值:
updateAddress(address){
this.addressSelected = true;
this.selectedAddress = address;
console.log(this.selectedAddress);
}
当我打印传递过来的值时,控制台日志显示 [object Object]。我在人们使用 ngModel 的地方发现了一些相互矛盾的答案,但是,我注意到这种方法已被弃用。
该表单是使用以下方法创建的:
<form [formGroup]="orderForm" (ngSubmit)="onSubmit()" novalidate>
我使用 formGroup 作为变量类型,并使用 formBuilder.group 将验证器添加到每个字段。
我应该更改什么才能将其传递到我的控制器 (.ts) 文件?
I am trying to pass an object as parameter using Angular 9.0.7 in a select.
Code looks like this:
<div *ngIf="foundAddresses == true">
<label class="bold">Select Address</label>
<select [ngClass]="{'error-message' : orderForm.controls['address'].touched && orderForm.controls['address'].hasError('required')}" (change)="updateAddress($event.target.value)" formControlName="address" class="titlewidth bottomspacing findAddressSelect">
<option>Please select</option>
<option *ngFor="let address of addresses" value="{{address}}">
{{address.summaryline}}
</option>
</select>
</div>
The addresses is an array of objects, where address is an object containing different key-value pairs. An example of an object entry in the array looks like this:
{
"addressline1": "1 Heol Dolwen",
"summaryline": "1 Heol Dolwen, Cardiff, South Glamorgan, CF14 1RX",
"number": "1",
"premise": "1",
"street": "Heol Dolwen",
"posttown": "Cardiff",
"county": "South Glamorgan",
"postcode": "CF14 1RX",
"recodes": "CF4 1RX:1A:199812"
},
And I am trying to get the value like this:
updateAddress(address){
this.addressSelected = true;
this.selectedAddress = address;
console.log(this.selectedAddress);
}
When I am printing the value that gets passed over, the console log shows [object Object]. I have found some conflicting answers where people were using ngModel, however, I have noticed this method is deprecated.
The form has been created using this:
<form [formGroup]="orderForm" (ngSubmit)="onSubmit()" novalidate>
I have used formGroup as the variable type and formBuilder.group to add Validators to each field.
What should I change to be able to pass it over to my controller (.ts) file?
如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。
绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱,如果其他用户或者作者回复了您的评论,将不能在第一时间通知您!
发布评论
评论(1)
只是为了确认一下,您想在更改时将整个地址对象传递给 updateAddress 方法吗?
或者,如果您只想要 address.summaryline 那么下面应该可以正常工作
`
`
Just to confirm, you want to pass the entire address object to the updateAddress method on change?
Or if you just want the address.summaryline then below should work fine
`
`