Question

我正在研究Angular代码。

如果我在表单字段中手动输入值并提交表单，则会在组件函数中获得所有值。

但是，如果我在value='{{detail_id}}'之类的表单字段中动态显示值，则该组件不会收集任何值。

组件功能

public updateSetting(obj:any) :any {
  console.log(obj);
}

模板

<form (ngSubmit)="updateSetting({'uname':uname, 'upwd':upwd, 'id':id})">
  <div class="form-group">
    <label for="email">Email address:</label>
    <input type="text" [(ngModel)]='uname' name='uname' class="form-control" value='{{detail_uname}}'>
  </div>

  <div class="form-group">
    <label for="pwd">Password:</label>
    <input type="password" name='upwd' [(ngModel)]="upwd" class="form-control" value='{{detail_upwd}}'>
  </div>

  <input type="hidden" name="id" [(ngModel)]='id' class="form-control" value='{{detail_id}}'>

  <button type="submit" class="btn btn-default">Update</button>
</form>

这些值动态显示在表单字段中，单击列表中的查看按钮

列表上的按钮

<a (click) = "view({'id':x.id})">View</a>

Answer 1

我不确定您为什么要使用价值，但是：

[value]="detail_uname"

Answer 2

您不需要使用值，ngModel用于存储显示值。

<input type="text" [(ngModel)]='detail_uname' name ='uname' class="form-control">
<input type="hidden" name="id" [(ngModel)] = 'detail_id' class="form-control">

请注意，detail_id必须在ts端定义。

动态值不是从表单提交的

2 个答案: