我在AngularJS自定义指令中首先尝试。
在指令的link函数中使用(或理解…)隔离范围时遇到困难。
这是我应用程序这部分的代码:
view.html
... <raw-data id="request-data" title="XML of the request" data="request">See the request</raw-data> ...
request是在viewCtrl的范围内发布的变量,其中包含请求的xml-string。
rawData.js
directives.directive('rawData',function() { return { restrict : 'E',templateUrl : 'partials/directives/raw-data.html',replace : true,transclude : true,scope : { id : '@',title : '@',data : '=' },link : function($scope,$elem,$attr) { console.log($scope.data); //the data is correclty printed console.log($scope.id); //undefined } }; });
raw-data.html
<div> <!-- Button to trigger modal --> <a href="#{{id}}Modal" role="button" class="btn" data-toggle="modal" ng-transclude></a> <!-- Modal --> <div id="{{id}}Modal" class="modal hide fade" tabindex="-1" role="dialog" aria-labelledby="{{id}}Modal" aria-hidden="true"> <div class="modal-header"> <button type="button" class="close" data-dismiss="modal" aria-hidden="true">×</button> <h3 id="myModalLabel">{{ title }}</h3> </div> <div class="modal-body"> <textarea class="input-block-level" rows="10">{{ data }}</textarea> </div> <div class="modal-footer"> <!-- <button class="btn" ng-click="toggleTagText('')">{{'cacher'}} l'image</button> --> <button class="btn btn-primary" data-dismiss="modal" aria-hidden="true">Fermer</button> </div> </div> </div>
我不明白为什么当模态弹出时,ID是相关的,但是当我尝试使用console.log()时,它的值是未定义的。
也许我错误的隔离范围值(=和@)。
谢谢你阅读。