AngularJs1.x自定義指令獨立作用域的函數(shù)傳入?yún)?shù)方法
在定義指令的scope屬性如果設(shè)置成了{}，那就成為了一個獨立作用域，如果要傳入一個方法，使用&,但是這里的傳參有點不一樣。
先看下官網(wǎng)解釋：
& or &attr - provides a way to execute an expression in the context of the parent scope. If no attr name is specified then the attribute name is assumed to be the same as the local name. Given and widget definition of scope: { localFn:'&myAttr' }, then isolate scope property localFn will point to a function wrapper for the count = count + value expression. Often it's desirable to pass data from the isolated scope via an expression and to the parent scope, this can be done by passing a map of local variable names and values into the expression wrapper fn. For example, if the expression is increment(amount) then we can specify the amount value by calling the localFn as localFn({amount: 22}).
這里有個例子：
<!DOCTYPE html>
<html>
<head lang="en">
<meta charset="UTF-8">
<title></title>
</head>
<body ng-app="app1">
<div ng-controller="MyCtrl">
<div ng-repeat="item in items" my-component isolated-expression-foo="updateItem(item,temp)">
{{item|json}}
</div>
</div>
</body>
<script src="../scripts/angular.js"></script>
<script>
var myModule = angular.module('app1', [])
.directive('myComponent', function () {
return {
restrict:'A',
scope:{
isolatedExpressionFoo:'&'
},
link:function(scope,element,attr) {
scope.isolatedExpressionFoo();
}
};
})
.controller('MyCtrl', ['$scope', function ($scope) {
$scope.items=[{id:1,value:"test"},{id:2,value:"TEst2"}];
$scope.updateItem = function (item,temp) {
console.log("Item param "+item.id);
console.log("temp param " + temp);
}
}]);
</script>
</html>
以上這篇AngularJs1.x自定義指令獨立作用域的函數(shù)傳入?yún)?shù)方法就是小編分享給大家的全部內(nèi)容了，希望能給大家一個參考，也希望大家多多支持腳本之家。
- javascript自定義日期比較函數(shù)用法示例
- JS中創(chuàng)建自定義類型的常用模式總結(jié)【工廠模式,構(gòu)造函數(shù)模式,原型模式,動態(tài)原型模式等】
- JS自定義函數(shù)實現(xiàn)時間戳轉(zhuǎn)換成date的方法示例
- JavaWeb開發(fā)之JSTL標簽庫的使用、 自定義EL函數(shù)、自定義標簽（帶屬性的、帶標簽體的）
- js document.getElementsByClassName的使用介紹與自定義函數(shù)
- 自定義require函數(shù)讓瀏覽器按需加載Js文件
- 常用原生js自定義函數(shù)總結(jié)
- JS自定義函數(shù)對web前端上傳的文件進行類型大小判斷
- PHP自定義函數(shù)格式化json數(shù)據(jù)示例
- 詳解JavaScript自定義函數(shù)
相關(guān)文章
Angular.js與Bootstrap相結(jié)合實現(xiàn)手風(fēng)琴菜單代碼
這篇文章主要介紹了Angular.js與Bootstrap相結(jié)合實現(xiàn)手風(fēng)琴菜單的相關(guān)資料,需要的朋友可以參考下2016-04-04
在 Angular2 中實現(xiàn)自定義校驗指令（確認密碼）的方法
這篇文章給大家探索 Angular 2 內(nèi)建的自定義驗證，非常不錯，具有參考借鑒價值，需要的朋友參考下2017-01-01
基于AngularJS拖拽插件ngDraggable.js實現(xiàn)拖拽排序功能
ngDraggable.js是一款比較簡單實用的angularJS拖拽插件，借助于封裝好的一些自定義指令，能夠快速的進行一些拖拽應(yīng)用開發(fā)。本文先從基本概念入手，給大家介紹的非常詳細，具有一定的參考借鑒價值，需要的朋友參考下吧2019-04-04
AngularJs定時器$interval 和 $timeout詳解
這篇文章主要介紹了AngularJs定時器$interval 和 $timeout詳解，小編覺得挺不錯的，現(xiàn)在分享給大家，也給大家做個參考。一起跟隨小編過來看看吧2017-05-05
Angular作為目前最為流行的前端框架，受到了前端開發(fā)者的普遍歡迎。不論是初學(xué)Angular的新手，還是有一定Angular開發(fā)經(jīng)驗的開發(fā)者，了解本文中的12個經(jīng)典面試問題，都將會是一個深入了解和學(xué)習(xí)Angular2的知識概念的絕佳途徑。2021-05-05
angular是Google開發(fā)的一個單頁面應(yīng)用框架,是現(xiàn)在比較主流的單頁面應(yīng)用框架之一，下面通過本文給大家介紹AngularJs中route的使用方法和配置，感興趣的朋友一起學(xué)習(xí)吧2016-02-02
AngularJS獲取json數(shù)據(jù)的方法詳解
這篇文章主要介紹了AngularJS獲取json數(shù)據(jù)的方法,結(jié)合實例形式詳細分析了AngularJS獲取json數(shù)據(jù)的詳細步驟、操作技巧與相關(guān)注意事項,需要的朋友可以參考下2017-05-05
詳解如何為你的angular app構(gòu)建一個第三方庫
這篇文章主要介紹了詳解如何為你的angular app構(gòu)建一個第三方庫，小編覺得挺不錯的，現(xiàn)在分享給大家，也給大家做個參考。一起跟隨小編過來看看吧2018-12-12
AngularJS基礎(chǔ) ng-focus 指令簡單示例
本文主要介紹AngularJS ng-focus 指令,這里整理了ng-focus的一些基礎(chǔ)資料,并附一個實例代碼,有需要的小伙伴參考下2016-08-08
本篇文章主要介紹了AngularJS 霸道的過濾器小結(jié)，在實際操作中，我們需要對統(tǒng)一數(shù)據(jù)源進行多次轉(zhuǎn)換，本文詳細討論有關(guān)過濾器的用法 。2017-04-04