Question

我有一个只有1个下拉字段的小角度网页，在我的component.html中声明为formControlName="serviceName".

下拉详细信息：

    <div class="dropdown">
      <label for="serviceName">Select the Service</label>
      <select class="form-control" formControlName="serviceName" id="serviceName">
        <option *ngFor="let service of srvNames; let i = index" [value]="service">{{ service.ServiceName }}</option>
      </select>
    </div>

在我的组件中，我有一个声明为srvNames: any[];的数组，并且这个数组正在通过对服务的http调用来填充。

用户可以使用下拉列表并选择不同的值，这些值会显示在我的网页中。使用get（＆＃39; serviceName＆＃39;）。valueChanges和subscribe我想跟踪更改。

this.servicesForm.get('serviceName').valueChanges
      .subscribe(
        (value) => {
          console.log(value);
        }
      );

当我在console.log中从订阅中获取值时，我看到我正在返回[object Object]

但是当我在console.log中我的数组时，我看到了值：

0:{ServiceName: "PhdTimeSeriesVS"}
1:{ServiceName: "Product"}
length:2
__proto__:Array(0)

有人能帮助我吗？谢谢，利诺

Answer 1

您正在返回一个对象：

{ServiceName: "PhdTimeSeriesVS"}

在您的选择中，您将该对象作为值

传递

<option *ngFor="let service of srvNames; let i = index" [value]="service">

将其更改为传递给定键的值：

<option *ngFor="let service of srvNames; let i = index" [value]="service.ServiceName">

Angular ReactiveFrom订阅valueChanges给出[object Object]

1 个答案: