AngularJs1.x自定義指令獨立作用域的函數(shù)傳入?yún)?shù)方法
在定義指令的scope屬性如果設置成了{}，那就成為了一個獨立作用域，如果要傳入一個方法，使用&,但是這里的傳參有點不一樣。
先看下官網(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ù)方法就是小編分享給大家的全部內容了，希望能給大家一個參考，也希望大家多多支持腳本之家。
- javascript自定義日期比較函數(shù)用法示例
- JS中創(chuàng)建自定義類型的常用模式總結【工廠模式,構造函數(shù)模式,原型模式,動態(tài)原型模式等】
- JS自定義函數(shù)實現(xiàn)時間戳轉換成date的方法示例
- JavaWeb開發(fā)之JSTL標簽庫的使用、 自定義EL函數(shù)、自定義標簽（帶屬性的、帶標簽體的）
- js document.getElementsByClassName的使用介紹與自定義函數(shù)
- 自定義require函數(shù)讓瀏覽器按需加載Js文件
- 常用原生js自定義函數(shù)總結
- JS自定義函數(shù)對web前端上傳的文件進行類型大小判斷
- PHP自定義函數(shù)格式化json數(shù)據(jù)示例
- 詳解JavaScript自定義函數(shù)
相關文章
延遲加載是一種限制加載用戶當前需要的模塊的方法,這可以提高應用程序的性能并減小初始捆綁包大小,在本文中,您學習了如何在 Angular 應用程序中使用惰性加載路由,本文分步驟講解的非常詳細,感興趣的朋友一起看看吧2024-02-02
Angular中的ng-template及angular 使用ngTemplateOutlet 指令的方法
ng-template 是用來定義模板的，當使用ng-template定義好一個模板之后，可以用ng-container和templateOutlet指令來進行使用。這篇文章給大家介紹了Angular中的ng-templateangular及使用 ngTemplateOutlet 指令的方法，需要的朋友參考下吧2018-08-08
本篇文章主要介紹了說說AngularJS中的$parse和$eval的用法，小編覺得挺不錯的，現(xiàn)在分享給大家，也給大家做個參考。一起跟隨小編過來看看吧2017-09-09
下面小編就為大家?guī)硪黄狝ngularJs 終極購物車的實例講解。小編覺得挺不錯的，現(xiàn)在就分享給大家，也給大家做個參考。一起跟隨小編過來看看吧2017-11-11
Angular outlet實現(xiàn)頁面布局示例詳解
這篇文章主要為大家介紹了Angular outlet實現(xiàn)頁面布局示例詳解,有需要的朋友可以借鑒參考下,希望能夠有所幫助,祝大家多多進步,早日升職加薪2023-10-10
這篇文章主要介紹了使用Chrome瀏覽器調試AngularJS應用的方法,AngularJS是非常熱門的JavaScript庫,需要的朋友可以參考下2015-06-06
這篇文章主要介紹了angular2 NgModel模塊的具體使用方法，文中通過示例代碼介紹的非常詳細，對大家的學習或者工作具有一定的參考學習價值，需要的朋友們下面隨著小編來一起學習學習吧2019-04-04
本篇文章主要介紹了angular實現(xiàn)IM聊天圖片發(fā)送實例，小編覺得挺不錯的，現(xiàn)在分享給大家，也給大家做個參考。一起跟隨小編過來看看吧2017-05-05
Angular通過?HTTP?Interceptor?實現(xiàn)?HTTP?請求超時監(jiān)控的例子
這篇文章主要介紹了Angular?如何通過?HTTP?Interceptor?實現(xiàn)?HTTP?請求的超時監(jiān)控,本文通過例子給大家介紹的非常詳細，對大家的學習或工作具有一定的參考借鑒價值，需要的朋友可以參考下2022-06-06
在AngularJS中$interval用來處理間歇性處理一些事情,接下來通過本文給大家介紹AngularJS中$interval的用法，需要的朋友參考下2016-02-02