說說AngularJS中的$parse和$eval的用法
AngularJS的初學(xué)者常常會對$parse和$eval兩個內(nèi)建服務(wù)感到有些困惑，今天我們就來說說AngularJS中的$parse和$eval。
總的來說，$parse和$eval都是作用于AngularJS的表達(dá)式。
什么是表達(dá)式？
AngularJS中的表達(dá)式就是一些類似于JavaScript代碼的代碼片段（但是它們和JavaScript代碼有不盡相同）。表達(dá)式通常被用來防止在綁定中，例如{{expression}}。下面是一個例子：
1 + 2 = {{ 1 + 2 }}
或者：
My name is {{ user.name }}
$parse服務(wù)
$parse服務(wù)可以講一個表達(dá)式轉(zhuǎn)換為一個函數(shù)。這個函數(shù)可以被調(diào)用，其中的參數(shù)是一個上下文對象，通常來說是作用域。
另外，通過$parse的表達(dá)式返回的這個函數(shù)有一個assign屬性。這個assign屬性也是一個函數(shù)，它可以用來在給定的上下文中改變這個表達(dá)式的值。
下面是一段簡單的代碼：
<div my-attr="obj.name" my-directive>testing</div>
app.directive('myDirective',function($log,$parse){
return function(scope,elem,attrs){
//解析"my-attr屬性值到一個函數(shù)中"
var model = $parse(attrs.myAttr);
//model現(xiàn)在是一個函數(shù)，可以調(diào)用它來獲取表達(dá)式的值
//下面這行代碼將會輸出作用域中obj.name的值
$log.log(model(scope));
elem.bind('click',function(){
//'model.assign'也是一個函數(shù)，它用來更新表達(dá)式的值
model.assign(scope,'New name');
scope.$apply();
})
}
});
上面的例子可以充分體現(xiàn)我們?yōu)槭裁葱枰?parse服務(wù)。如果屬性值是name，那么我們完全可以不用$parse，只用scope[attrs.myAttr]即可。但是在上面的例子中，方括號并不管用。
$eval服務(wù)
$eval是一個作用域scope中的方法，它將會在當(dāng)前作用域中執(zhí)行一個表達(dá)式并返回結(jié)果：
scope.a = 1;
scope.b = 2;
scope.$eval('a+b'); // 3
以上就是本文的全部內(nèi)容，希望對大家的學(xué)習(xí)有所幫助，也希望大家多多支持腳本之家。
相關(guān)文章
Angular 4依賴注入學(xué)習(xí)教程之InjectToken的使用（八）
這篇文章主要給大家介紹了關(guān)于Angular 4依賴注入之InjectToken使用的相關(guān)資料，文中介紹的非常詳細(xì)，對大家學(xué)習(xí)或者使用Angular4具有一定的參考學(xué)習(xí)價值，需要的朋友們下面來跟著小編一起學(xué)習(xí)學(xué)習(xí)吧。2017-06-06
本篇文章主要介紹了AngularJs常用的過濾器。具有很好的參考價值。下面跟著小編一起來看下吧2017-05-05
Angular.JS判斷復(fù)選框checkbox是否選中并實時顯示
最近因為工作需要做了一個選擇標(biāo)簽的功能，把一些標(biāo)簽展示給用戶，用戶選擇自己喜歡的標(biāo)簽，就類似我們在購物網(wǎng)站看到的那種過濾標(biāo)簽似的，所以這篇文章就給大家介紹了Angular.JS判斷復(fù)選框checkbox是否選中并實時顯示的方法，下面來一起看看吧。2016-11-11
AngularJS Toaster是一個 AngularJS 提示框.基于angular v1.2.6 及以上和angular-animate.這篇文章主要介紹了AngularJS Toaster使用詳解,需要的朋友可以參考下2017-02-02
angularjs 的數(shù)據(jù)綁定實現(xiàn)原理
本篇文章主要介紹了angularjs 的數(shù)據(jù)綁定實現(xiàn)原理，小編覺得挺不錯的，現(xiàn)在分享給大家，也給大家做個參考。一起跟隨小編過來看看吧2018-07-07
Angular.js中angular-ui-router的簡單實踐
本篇文章主要介紹了Angular.js中angular-ui-router的簡單實踐，具有一定的參考價值，感興趣的小伙伴們可以參考一下2017-07-07
AngularJS 驗證碼60秒倒計時功能的實現(xiàn)
最近在做AngularJS 項目，這是寫的一個60秒倒計時功能，下面小編給大家介紹AngularJS 驗證碼60秒倒計時功能的實現(xiàn)，需要的朋友參考下吧2017-06-06
本篇文章主要介紹了解決AngualrJS頁面刷新導(dǎo)致異常顯示問題的方法。具有很好的參考價值。下面跟著小編一起來看下吧2017-04-04
本文主要介紹AngularJS 事件,這里整理了相關(guān)資料,比較詳細(xì)的介紹了AngularJS的使用方法,有需要的小伙伴參考下2016-07-07
Angular入口組件（entry component）與聲明式組件的區(qū)別詳解
這篇文章主要給大家介紹了關(guān)于Angular入口組件（entry component）與聲明式組件的區(qū)別的相關(guān)資料，文中通過示例代碼介紹的非常詳細(xì)，對大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價值，需要的朋友們下面隨著小編來一起學(xué)習(xí)學(xué)習(xí)吧。2018-04-04