在表单项中使用 ngModel 和 [(ngModel)] 有什么区别?
What is the difference between using ngModel and [(ngModel)] in form items?
我知道 [(ngModel)] 用于双向绑定。
我有一个输入框。它应该显示来自数据库的值,并允许用户更改它并保存回数据库。
为此,我相信我应该使用 [(ngModel)] 以便可以从 ts 文件中的变量(从 db 检索)中设置字段值。是否可以仅使用如下所示的 ngModel 以任何其他方式实现同样的效果?
<ion-item>
<ion-label floating>First Name</ion-label>
<ion-input type="text" ngModel name="firstName" required></ion-input>
</ion-item>
叫做Template Driven Approach
插入 ngModel
ionic 将知道这有一个要通过 Javascript 表示处理的动作。这被称为注册控件
您可以达到与
相同的效果
<form #f="ngForm" (ngSubmit) = "onAddItem(f)">
:
#f
创建本地引用并可以访问表单的 HTML 框架。通过添加 "ngForm",#f 将可以访问由 Angular 创建的表单的 Javascript 表示。 (ngSubmit)
监听表单的提交,并在触发提交事件时将表单传递给onAddItem方法
我知道 [(ngModel)] 用于双向绑定。
我有一个输入框。它应该显示来自数据库的值,并允许用户更改它并保存回数据库。
为此,我相信我应该使用 [(ngModel)] 以便可以从 ts 文件中的变量(从 db 检索)中设置字段值。是否可以仅使用如下所示的 ngModel 以任何其他方式实现同样的效果?
<ion-item>
<ion-label floating>First Name</ion-label>
<ion-input type="text" ngModel name="firstName" required></ion-input>
</ion-item>
叫做Template Driven Approach
插入 ngModel
ionic 将知道这有一个要通过 Javascript 表示处理的动作。这被称为注册控件
您可以达到与
相同的效果<form #f="ngForm" (ngSubmit) = "onAddItem(f)">
:
#f
创建本地引用并可以访问表单的 HTML 框架。通过添加 "ngForm",#f 将可以访问由 Angular 创建的表单的 Javascript 表示。 (ngSubmit)
监听表单的提交,并在触发提交事件时将表单传递给onAddItem方法