溫馨提示×
您好，登錄后才能下訂單哦！
點擊 登錄注冊 即表示同意《億速云用戶服務條款》
您好，登錄后才能下訂單哦！
緊接上節談到再談angularjs DI(Dependency Injection)，在這里介紹關于angularjs的表達式expression。expression指的是javascript的一小片段代碼，通常用于綁定（binding）例如：` expression `。在angularjs中是通過$parse service解析。
$parse用法： $parse(expression);
下面的表達式在angularjs將都是合法的表達式：
angularjs表達式vs. javascript表達式
angularjs視圖表達式有點像javascript表達式，但是并不是利用javascript表達式eval()函數解析執行的，與javascript表達式區別如下：
注： 對于angularjs表達式，可以采用$eval()方法解析執行。
Demo
html:
- <!doctype html>
- <html ng-app>
- <head>
- <script src="http://code.angularjs.org/angular-1.0.2.min.js"></script>
- <script src="script.js"></script>
- </head>
- <body>
- <div ng-controller="Cntl2" class="expressions">
- Expression:
- <input type='text' ng-model="expr" size="80"/>
- <button ng-click="addExp(expr)">Evaluate</button>
- <ul>
- <li ng-repeat="expr in exprs">
- [ <a href="" ng-click="removeExp($index)">X</a> ]
- <tt>`expr`</tt> => <span ng-bind="$parent.$eval(expr)"></span>
- </li>
- </ul>
- </div>
- </body>
- </html>
js:
- function Cntl2($scope) {
- var exprs = $scope.exprs = [];
- $scope.expr = '3*10|currency';
- $scope.addExp = function(expr) {
- exprs.push(expr);
- };
$scope.removeExp = function(index) {
exprs.splice(index, 1);
};
}
jsfiddle演示:http://jsfiddle.net/whitewolf/yduLt/1/
屬性執行
angularjs所有的表達式執行都將依賴于一個作用于scope,不同于javascript的window全局作用域.如果你想引用全局作用于window,這必須依賴于上節的DI特性中引用$window service. 實例如下:
html:
- <!doctype html>
- <html ng-app>
- <head>
- <script src="http://code.angularjs.org/angular-1.0.2.min.js"></script>
- <script src="script.js"></script>
- </head>
- <body>
- <div class="example2" ng-controller="Cntl1">
- Name: <input ng-model="name" type="text"/>
- <button ng-click="greet()">Greet</button>
- </div>
- </body>
- </html>
js:
- function Cntl1($window, $scope){
- $scope.name = 'World';
- $scope.greet = function() {
- ($window.mockWindow || $window).alert('Hello ' + $scope.name);
- }
- }
jsfiddle演示:http://jsfiddle.net/whitewolf/MF2Ku/1/
兼容執行
如上所述：angularjs表達式計算兼容處理null和undefined不會拋出任何異常，因為這將現實處理在view顯示，而javascript則會拋出NullPointerExceptions異常。例如表達式
`a`.`b`.`c`，與其同等效果的javascript代碼將是{{((a||{}).b||{}).c}}。 無控制流程
在angularjs表達式中將不存在條件，循環，throw控制流程語句。因為angularjs作為mvc或者貼近pm模式要求表現層邏輯必須包含在controller中，而不是view，view應該足夠的被動。在表達式模式中都盡力將表現層不變的表現邏輯和多樣易變的UI view中抽離出來，便于更好的自動化測試構建等。
過濾器（Filters）
數據僅作為一種持久化存儲領域模型（表現層或者確切的成為視圖模型viewmodel），當展現給用戶的時候很多時候需要更友好的方式，比如時間，數字，貨幣格式本地化，
例如： name | uppercase ， 123 | number:2，3*10|currency。
filters支持鏈式寫法，如何powershell或者其他操作系統外殼語言一樣的管道式模型，形如 value | filter1 | filter2。
其他資源可參考本博客中其他angularjs隨筆或者angularjs官方文檔http://angularjs.org/。
免責聲明：本站發布的內容（圖片、視頻和文字）以原創、轉載和分享為主，文章觀點不代表本網站立場，如果涉及侵權請聯系站長郵箱：is@yisu.com進行舉報，并提供相關證據，一經查實，將立刻刪除涉嫌侵權內容。
