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

Question

我正在尝试构建一个角度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>

有解决方案吗

Answer 1

如果要在没有双向绑定的情况下提供默认值，请使用[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>

Answer 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"
}

Answer 3

尝试从输入中删除值

<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>

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