将默认值添加到输入字段Angular2

时间:2017-04-19 12:05:49

标签: angular input

我正在尝试构建一个角度2应用程序,我的问题是我想为输入提供一个默认值并禁用它我试过这个但是它没有用。

<div class="form-group">
    <label for="input01">UUID</label>
    <input class="form-control form-control-rounded" id="input01" style="width:600px;margin-left:60px" type="text" [(ngModel)]="beacon.uuid" value="{{uuid}}" name="uuid" disabled>
  </div>

任何解决方案?

3 个答案:

答案 0 :(得分:7)

如果您想在没有双向绑定的情况下提供默认值,请使用[value]

<div class="form-group">
  <label for="input01">UUID</label>
  <input id="input01" type="text" [value]="beacon.uuid" class="form-control form-control-rounded" name="uuid" disabled>
</div>

答案 1 :(得分:2)

您的模板:

<div class="form-group">
    <label for="input01">UUID</label>
    <input class="form-control form-control-rounded" id="input01" style="width:600px;margin-left:60px" type="text" [(ngModel)]="beacon.uuid" name="uuid" [disabled]="true">
  </div>

在您的组件中:

ngOnInit() {
  beacon.uuid = "my default value"
}

答案 2 :(得分:0)

尝试从输入中删除值

<div class="form-group">
    <label for="input01">UUID</label>
    <input class="form-control form-control-rounded" id="input01" type="text" [(ngModel)]="beacon.uuid" name="uuid" disabled>
</div>

否则,您的样式和已禁用属性之间将发生冲突