標籤：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: true36 };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中使用第四個參數ｃｔｒｌ調用到依賴的指令的controller中的方法變數．
可以看到son, daughter都可以調用到parent中的click函數，並且操作同一個data．可以發現click前面用this，修飾．
data如果也使用this．修飾，那麼結果是一樣的，可以被其依賴的指令使用ctrl.data訪問到.
所以當幾個指令有共同的方法時可以抽取到一個指令中，然後ｒｅｑｕｉｒｅ一下．
上面的寫法是
<parent name="123"> <son></son> <daughter></daughter> </parent>
按照上面的說法是使用父元素的controller，所以^不可少，寫法也必須那麼寫才可以調到ｃｌｉｃｋ函數.
補充
引入其他指令並注入到控制器中，並作為當前指令的連結函數的第四個參數。require使用字串或數組元素來傳入指令。如果是數組，注入的參數是一個相應順序的數組。如果這樣的指令沒有被找到，或者該指令沒有控制器， 就會報錯。 require參數可以加一些首碼：
AngularJS指令之 require 參數 的用法
Start building with 50+ products and up to 12 months usage for Elastic Compute Service
1 on 1 presale consultation
24/7 Technical Support 6 Free Tickets per Quarter Faster Response
Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.
A comprehensive suite of global cloud computing services to power your business
Payment Methods We Support
