首页 > 解决方案 > 角度参考# vs ngModel

问题描述

我想知道什么时候必须在我的输入中使用 [(ngModel)] 以及什么时候可以只使用 #reference 例如

<div class="form-group">
  <div class="input-group mb-2">
    <input type="text" class="form-control" [(ngModel)]="newUser">
    <button class="btn btn-outline-success" (click)="onAddUser()">Add user</button>
  </div>
</div>

我应该在这里这样做,或者我可以这样做:

<div class="form-group">
  <div class="input-group mb-2">
    <input type="text" class="form-control" #newUser>
    <button class="btn btn-outline-success" (click)="onAddUser(newUser.value)">
      Add user
    </button>
  </div>
</div>

我会感谢任何答案)

标签: angularangular-ngmodelangular-template-variable

解决方案


不必使用[(ngModel)],永远。NgModel是 Angular 的一部分FormsModule。如果你有FormsModule导入​​的,你可以使用ngModel. 这样做会创建一个NgFormand FormControl,您可以在更复杂的反应式和动态表单中使用它,并将跟踪字段的状态,例如脏、触摸。它还允许您在字段上放置错误验证器,并公开一个可观察的值更改流。

使用模板变量并ViewChild像使用 vanilla JS 一样抓取输入元素并与之交互也很好,尤其是在您的用例很简单的情况下。这样你可以避免FormsModule在你的模块中包含。


推荐阅读