据我所知,ng-model 设置了分配模型的特定元素的值。鉴于 ng-value 与 ng-model 有何不同?
ng-model 和 ng-value 之间有什么区别/不兼容?
它与 ng-model 一起工作;对于收音机和选择,它是在选择该项目时设置为 ng-model 的值。将其用作元素的 'value' 属性的替代,该属性将始终将字符串值存储到关联的 ng-model。
在单选按钮的上下文中,它允许您使用非字符串值。例如,如果您的单选按钮“是”和“否”(或等效项)的值为“真”和“假”——如果使用“值”,则存储到 ng-model 中的值将成为字符串。如果您使用 'ng-value',它们将保持为布尔值。
但是,在 select 元素的上下文中,请注意 ng-value 仍将始终被视为字符串。要为选择设置非字符串值,请使用 ngOptions。
简单描述
ng模型
- 用于变量的双向绑定,可以在作用域和 html 上使用。
- 其中具有
$modelValue
(值驻留在实际范围内)&$viewValue
(显示在视图中的值)。 - 如果你在表单上提到了 name 属性,那么 angular 会在内部为它创建验证属性,比如 $error、$valid、$invalid 等。
例如。
<input type="text/checkbox/radio/number/tel/email/url" ng-model="test"/>
ng值
- 用于为相应的
ng-model
值赋值,如input
,select
&textarea
(同样可以通过使用来完成ng-init
) ng-value
如果您ng-model
通过 ajax设置值而编写value
属性不支持它,则确实提供了良好的绑定- 基本上意味着在动态创建选项时使用
radio
&option
标记select
。 - 它只能有
string
值,它不支持对象值。
HTML
<input
[ng-value="string"]>
...
</input>
或者
<select ng-model="selected">
<option ng-value="option.value" ng-repeat="option in options">
{{option.name}}
</option>
</select>
...
ng-value
ininput
字段的一个很好的用途是如果您想绑定到一个变量,但基于另一个变量的值。例子:
<h1>The code is {{model.code}}.</h1>
<p>Set the new code: <input type="text" ng-bind="model.code" /></p>
当用户输入 时input
,标题中的值将被更新。如果你不想要这个,你可以修改为:
<input type="text" ng-value="model.code" ng-bind="model.theNewCode" />
theNewCode
将被更新,但code
将保持不变。
根据https://docs.angularjs.org/api/ng/directive/ngValue,ngValue采用“角度表达式,其值将绑定到输入元素的 value 属性”。
因此,当您使用 ng-value="hard" 时,它被解释为一个表达式,并且该值绑定到 $scope.hard (可能未定义)。ngValue 可用于评估表达式——它在设置硬编码值方面没有 value 优势。但是,如果您想使用 ngValue 对值进行硬编码,则必须将其括在 '' 中:
ng-value="'hard'"
ng-model旨在放置在表单元素内,并具有双向数据绑定($scope --> 视图和视图 --> $scope)例如<input ng-model="val"/>.
或者您可以说ng-model指令将 HTML 控件(输入、选择、文本区域)的值绑定到应用程序数据。
该文件明确指出,ng-value
这样做的时候,不应使用双向与结合ng-model
。
从文档:
值
将给定的表达式绑定到元素的值。
它也可以被用于实现单向给定表达式的输入元件,如结合
input[text]
或textarea
,当该元素不使用ngModel
。
相反,从控制器初始化值: