AngularJs Understanding the Model Component
在angular文檔討論的上下文中,術(shù)語“model”可以適用于單一對象代表一個實體(例如,一個叫” phones”的model,它的值是一個電話數(shù)組。)或者作為應用的全部數(shù)據(jù)Model(所有實體)。
在angular中,model可以是任意數(shù)據(jù),可以通過angular的scope對象的屬性來獲取model。屬性的名稱是model的標識,值可以是任意javascript對象(包括數(shù)組和原始數(shù)據(jù))。
javascript想成為model的唯一的條件是對象必須作為一個scope對象的屬性被angular scope引用。屬性的引用關系可以明確或者隱含地創(chuàng)建。
我們可以通過以下幾種方式來顯式創(chuàng)建scope的屬性,關聯(lián)javascript對象來創(chuàng)建model:
在javascript代碼中,直接賦值給scope對象的屬性;這通常發(fā)出現(xiàn)在controller中:
function MyCtrl($scope) {
// create property 'foo' on the MyCtrl's scope
// and assign it an initial value 'bar'
$scope.foo = 'bar';
}
在模版的angular表達式(http://www.cnblogs.com/lcllao/archive/2012/09/16/2687162.html)中,使用賦值操作符:
<button ng-click="{{foos='ball'}}">Click me</button>
在模版中使用ngInit directive(http://docs.angularjs.org/api/ng.directive:ngInit)(僅僅作為例子,不推薦在真實應用中使用)
<body ng-init=" foo = 'bar' ">
angular在下面的模版結(jié)構(gòu)中會隱式創(chuàng)建model:
表單的input 、select、textarea和其他form元素:
<input ng-model="query" value="fluffy cloud">
上面的代碼,在當前的scope中創(chuàng)建了一個叫”query”的model,并且與input的value值綁定,初始化為”fluffy cloud”。
在ngRepeater中聲明迭代器
<p ng-repeat="phone in phones"></p>
上面的代碼為每一個phones數(shù)組的元素各自創(chuàng)建了一個child scope,并且在對應的child scope中創(chuàng)建”phone”model,賦予數(shù)組中對應的值。
在angular中,當出現(xiàn)下面的情況時,javascript對象將不再是一個model:
當沒有angular scope包含與該對象關聯(lián)的屬性時。
所有包含與對象關聯(lián)的屬性的angular scope成為了陳舊和適合垃圾回收時。
下面的插圖展示了在一個簡單的模版中隱式創(chuàng)建一個簡單的數(shù)據(jù)model。

以上就是關于AngularJS Understanding the Model Component 的資料整理,后續(xù)繼續(xù)補充,謝謝大家對本站的支持!
相關文章
AngularJS實現(xiàn)的生成隨機數(shù)與猜數(shù)字大小功能示例
這篇文章主要介紹了AngularJS實現(xiàn)的生成隨機數(shù)與猜數(shù)字大小功能,結(jié)合完整實例形式分析了AngularJS隨機數(shù)生成與數(shù)值判定相關操作技巧,需要的朋友可以參考下2017-12-12
詳解AngularJs路由之Ui-router-resolve(預加載)
本篇文章主要介紹了詳解AngularJs路由之Ui-router-resolve(預加載),具有一定的參考價值,感興趣的小伙伴們可以參考一下2017-06-06
詳談Angular 2+ 的表單(一)之模板驅(qū)動型表單
這篇文章主要介紹了Angular 2+ 的表單(一)之模板驅(qū)動型表單,非常不錯,具有參考借鑒價值,需要的朋友可以參考下2017-04-04
angularjs ocLazyLoad分步加載js文件實例
本篇文章主要介紹了angularjs ocLazyLoad分步加載js文件,小編覺得挺不錯的,現(xiàn)在分享給大家,也給大家做個參考。一起跟隨小編過來看看吧2017-01-01

