获取选择选项属性值的反应形式

Question

嗨，我使用Angular 6反应。

这是选择控件

<select _ngcontent-c2="" class="floating-select ng-untouched ng-pristine ng-invalid" formcontrolname="user" value="" ng-reflect-name="user">
   <option _ngcontent-c2="" value="adduser" ng-reflect-value="adduser">--Add User--</option>
   <!--bindings={
      "ng-reflect-ng-for-of": "[object Object],[object Object"
      }-->
   <option _ngcontent-c2="" value="1: gokulanathan.s" ng-reflect-ng-value="gokulanathan.s" usrstatus="ACTIVE">gokulanathan.s</option>
   <option _ngcontent-c2="" value="2: subin.abraham.ext" ng-reflect-ng-value="subin.abraham.ext" usrstatus="ACTIVE">subin.abraham.ext</option>
   <option _ngcontent-c2="" value="3: subin.abraham.ext" ng-reflect-ng-value="subin.abraham.ext" usrstatus="INACTIVE">subin.abraham.ext</option>
   <option _ngcontent-c2="" value="4: manoj.g.ext" ng-reflect-ng-value="manoj.g.ext" usrstatus="ACTIVE">manoj.g.ext</option>
   <option _ngcontent-c2="" value="5: rajesh.augustine" ng-reflect-ng-value="rajesh.augustine" usrstatus="ACTIVE">rajesh.augustine</option>
</select>

是否可以使用formcontrol获取“usrstatus”属性值

这是我的formBuilder代码

  this.form = this.formBuilder.group({
      clientid: ['', Validators.required],
      user: ['', Validators.required],
      username: ['', Validators.required],
      status: ['', Validators.required]       
  });

我正在寻找这样的东西......“this.form.controls [”user“]。usrstatus”。请帮忙..

Answer 1

我不确定this.form.controls["user"].usrstatus，我认为不可能得到这样的属性值（如果我错了就纠正我）但你可以选择更改事件

<select _ngcontent-c2="" class="floating-select ng-untouched ng-pristine ng-invalid"
formcontrolname="user" value="" ng-reflect-name="user" (change)="getAttributeValue($event)">

在你的组件

getAttributeValue(event) {
    const selectEl = event.target;
    const attrVal = selectEl.options[selectEl.selectedIndex].getAttribute('usrstatus');
    console.log(attrVal)
}

Answer 2

我不确定，但我认为不可能从这样的选择选项获得第二个值。

首先请将formcontrolname更改为formControlName。

比你的选项中的值设置值='{“user”：“1：gokulanathan.s”，“status”：“ACTIVE”}'

您可以创建新的类或接口来接收这两个值，或者您可以使用JSON.parse方法并访问您的值，如下所示：

JSON.parse（this.form.get（ “用户”）的值。）。用户;

JSON.parse（this.form.get（ “用户”）的值。）.STATUS;

你可以在这里阅读更多关于formControlName的信息：https://angular.io/api/forms/FormControlName