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.js與Bootstrap相結合實現(xiàn)手風琴菜單代碼
這篇文章主要介紹了Angular.js與Bootstrap相結合實現(xiàn)手風琴菜單的相關資料,需要的朋友可以參考下2016-04-04
在 Angular2 中實現(xiàn)自定義校驗指令(確認密碼)的方法
這篇文章給大家探索 Angular 2 內建的自定義驗證,非常不錯,具有參考借鑒價值,需要的朋友參考下2017-01-01
基于AngularJS拖拽插件ngDraggable.js實現(xiàn)拖拽排序功能
ngDraggable.js是一款比較簡單實用的angularJS拖拽插件,借助于封裝好的一些自定義指令,能夠快速的進行一些拖拽應用開發(fā)。本文先從基本概念入手,給大家介紹的非常詳細,具有一定的參考借鑒價值,需要的朋友參考下吧2019-04-04
AngularJs定時器$interval 和 $timeout詳解
這篇文章主要介紹了AngularJs定時器$interval 和 $timeout詳解,小編覺得挺不錯的,現(xiàn)在分享給大家,也給大家做個參考。一起跟隨小編過來看看吧2017-05-05
AngularJS獲取json數(shù)據(jù)的方法詳解
這篇文章主要介紹了AngularJS獲取json數(shù)據(jù)的方法,結合實例形式詳細分析了AngularJS獲取json數(shù)據(jù)的詳細步驟、操作技巧與相關注意事項,需要的朋友可以參考下2017-05-05

