16 Model 组件

优质

小牛编辑

131浏览

2023-12-01

model这个词在AngularJS中既可以表示一个用来表示实体（比如，一个叫做phones的model，它的值是一个包含多个phone的数组）的对象，也可以表示应用中的整个数据模型，这取决于我们所讨论的AngularJS文档中的上下文。

在AngularJS中，一个模型就是一AngularJS作用于对象的任何一个可取的属性。属性的名字就是模型的标示符。它的值可以是任意的Javascript对象（包括数组和原始对象）。

将Javascript对象编程模型的唯一要求是这个对象必须被AngularJS作用域的一个属性引用。这个引用既可以显式也可以隐式地创建。

你可以像下面这样显式地创建一个作用域属性，引用Javascript对象：

在Javascript代码中直接将一个对象赋给作用域对象属性；这种情况常见于控制器中：

 function MyCtrl($scope) {
     // create property 'foo' on the MyCtrl's scope
     // and assign it an initial value 'bar'
     $scope.foo = 'bar';
 }

在模板中使用表达式：
<button ng-click="\{\{foos='ball'\}\}">Click me</button>
在模板中使用ngInit指令（只适用于实例，不推荐在实际应用中使用）：
<body ng-init=" foo = 'bar' ">

当处理下面这样的模板机构时，AngularJS会隐式地（通过创建一个作用域对象的属性，并将合适地值赋给它来实现）创建模型。

从input, select, textarea或者其他表单元素中：
<input ng-model="query" value="fluffy cloud">

上面的代码再当前作用域中创建了一个叫做query的模型，值被设置成"fluffy cloud"。

在ngRepeater的迭代声明中：
<p ng-repeat="phone in phones"></p>

上面代码为phones数组中的每一项都创建了一个子作用域。并且在自作用于中创建了一个叫做phone的对象（模型），它的值被设置成数组中当前的值。

在AngularJS中的下列情况中，Javascript对象也可以变成模型：

没有个属性里引用了Javascript对象的作用域对象。
所有的包含对象应用属性的作用域对象都已过期并且是会被回收的。

下面的图中描述了隐式地从模板中创建数据库模型：

16 Model 组件

相关主题