标签:error jquery cli java null 请求 控制 port 方法
require - 请求另外的controller,传入当前directive的link function中。require需要传入一个directive controller的名称。如果找不到这个名称对应的controller,那么将会抛出一个error。名称可以加入以下前缀:
? - 不要抛出异常。这使这个依赖变为一个可选项。
^ - 允许查找父元素的controller
1 <!DOCTYPE html> 2 <html> 3 <head> 4 <meta name="viewport" content="width=device-width, initial-scale=1.0"> 5 <link rel="stylesheet" href="bootstrap.min.css"> 6 <script src="jquery.min.js"></script> 7 <script src="angular.min.js"></script> 8 <script src="bootstrap.min.js"></script> 9 <script type="text/javascript"> 10 var myapp = angular.module("myapp", []); 11 myapp.controller("MyController", [‘$scope‘, function($scope) { 12 $scope.name = "mario"; 13 $scope.age = "13"; 14 $scope.send = function() { 15 console.log(‘.............‘); 16 }; 17 }]); 18 myapp.directive("parent", function() { 19 return { 20 restrict: ‘E‘, 21 scope:{}, 22 controller: function() { 23 // this.data = [‘1‘, ‘2‘, ‘3‘, ‘4‘, ‘5‘]; 24 data = [‘1‘, ‘2‘, ‘3‘, ‘4‘, ‘5‘]; 25 this.click = function() { 26 data.pop(); 27 console.log(data); 28 }; 29 }, 30 link: function(scope, elem, attrs) { 31 scope.name = ‘123‘; 32 }, 33 template: ‘<span>{{name}}<div ng-transclude></div></span>‘, 34 replace: true, 35 transclude: true 36 }; 37 }); 38 myapp.directive("son", function() { 39 return { 40 restrict: ‘E‘, 41 repalce: true, 42 require: ‘^?parent‘, 43 template: ‘<div ng-click="sonClick()">sonClick</div>‘, 44 link: function(scope, elem, atts, ctrl) { 45 scope.sonClick = ctrl.click; 46 // tmp = ctrl.data; 47 // console.log(tmp); 48 // ctrl.data.pop(); 49 } 50 }; 51 }); 52 myapp.directive("daughter", function() { 53 return { 54 restrict: ‘E‘, 55 repalce: true, 56 require: ‘^?parent‘, 57 template: ‘<div ng-click="daughterClick()">daughterClick</div>‘, 58 link: function(scope, elem, atts, ctrl) { 59 scope.daughterClick = ctrl.click; 60 // tmp = ctrl.data; 61 // console.log(tmp); 62 } 63 }; 64 }); 65 </script> 66 <style type="text/css"> 67 </style> 68 </head> 69 <body ng-app="myapp"> 70 <div class="container" ng-controller="MyController"> 71 <parent> 72 <son></son> 73 <daughter></daughter> 74 </parent> 75 </div> 76 </body> 77 </html>
require之后可以在link中使用第四个参数ctrl调用到依赖的指令的controller中的方法变量.
可以看到son, daughter都可以调用到parent中的click函数,并且操作同一个data.可以发现click前面用this,修饰.
data如果也使用this.修饰,那么结果是一样的,可以被其依赖的指令使用ctrl.data访问到.
所以当几个指令有共同的方法时可以抽取到一个指令中,然后require一下.
上面的写法是
<parent name="123"> <son></son> <daughter></daughter> </parent>
按照上面的说法是使用父元素的controller,所以^不可少,写法也必须那么写才可以调到click函数.
补充
引入其他指令并注入到控制器中,并作为当前指令的链接函数的第四个参数。require使用字符串或数组元素来传入指令。如果是数组,注入的参数是一个相应顺序的数组。如果这样的指令没有被找到,或者该指令没有控制器, 就会报错。 require参数可以加一些前缀:
标签:error jquery cli java null 请求 控制 port 方法
原文地址:http://www.cnblogs.com/lishalom/p/6501858.html