Angular 6在* ngfor表中选择

我有一个Angular 6组件，它获取一个可观察的用户列表，然后使用* ngFor语句显示用户的表 . 每行我都包含一个提交按钮，该按钮调用组件ts文件中的一个函数，该文件传入该行的用户 . 到目前为止，这是按预期工作的 .

现在，我想为每一行添加一个select选项，其中包含用户想要执行的操作列表 . 如何获取正确行的所选操作的值？

这是我到目前为止所拥有的 .

• 从http调用返回的示例JSON对象 .

[
  {
    "userId": 1,
    "username": "user1",
    "firstName": "f1",
    "lastName": "l1",
    "active": true
  },
  {
    "userId": 2,
    "username": "user2",
    "firstName": "f2",
    "lastName": "l2",
    "active": true
  }
]

在component.ts中，我将类型为UserSearchModel []的属性订阅到json响应，并为要调用的表创建了一个函数 .

users$: UserSearchModel[];

submituseraction(user: UserSearchModel) {
    console.log(user.userId);
  }

这是模型 .

export class UserSearchModel {
    userId: number;
    username: string;
    firstName: string;
    lastName: string;
    active: boolean;   
}

在html中，我有以下tr用于显示和提交数据 .

<tr *ngFor="let user of users$">
    <td>{{ user.username}}</td>
    <td style="word-break: break-all">{{ user.firstName }}</td>
    <td style="word-break: break-all">{{ user.lastName }}</td>
    <td>{{ user.active }}</td>
    <td class="text-nowrap">
      <select name="usersearchactions" id="usersearchactions" title="Actions">
        <option value="0">Update User Info</option>
        <option value="1">Update Email</option>
        <option value="2">Reset Password</option>
        <option value="3">Notification Settings</option>
        <option value="11">Research</option>
      </select>
      <button (click)="submituseraction(user)" class="btn btn-primary btn-xs" type="submit">GO!</button>
    </td>
  </tr>

到目前为止一切都很棒 . 我拉出用户列表并正确显示它们 . 每行还有一个下拉列表，用于选择要对用户执行的操作 . 我也在我的submituseraction方法中获得了正确的用户 . 我唯一的问题是如何在我的submituseraction方法中为该用户获取所选操作？我希望有一种简单的方法可以在没有太大变化的情况下获得这个 Value .

我确实尝试更新UserSearchModel以包含一个新的UserAction []，其中填充了我的列表并使用* ngfor命令显示它，这样我就可以 grab 传递给该函数的用户对象 . 这不起作用，因为在订阅事件中填充数据后未定义UserAction [] . 我甚至试图使它只读，并在构造函数中填充，没有运气 . 这两种方式我最终得到一个未定义的UserAction []，所以现在没有任何操作填充在select中 .

export class UserSearchModel {
        userId: number;
        username: string;
        firstName: string;
        lastName: string;
        active: boolean;
        userActions: UserAction[] = [
                { id: 0, name: "Update User Info" },
                { id: 1, name: "Update Email" },
                { id: 2, name: "Reset Password" },
                { id: 3, name: "Notification Settings" },
                { id: 4, name: "Patient Access Requests" },
                { id: 11, name: "Research" }
            ]
    }


    export class UserAction {
        id: number;
        name: string;
    }

<select name="userActions" id="userActions" title="Actions">
    <option *ngFor="let action of user.userActions" [value]="action"> 
        {{action.name}}</option>
      </select>

我不是改变模型的忠实粉丝，但即使这样也行不通 .

任何帮助/指导/指导将不胜感激 . 另外，我刚开始使用Angular（可能很明显就是这个问题），但是如果你看到其他任何明显错误的内容请告诉我 .

谢谢 .