但是当我没有模板集(或模板是空字符串)而不是访问隔离指令范围时,我访问父(控制器)范围.此外 – 这适用于Angular 1.1但不适用于1.2
这是HTML:
<div class="container" ng-app="app" ng-controller="AppController"> <sandBox title="Attribute Title"></sandBox> </div>
JavaScript的:
var app = angular.module('app',[],function () {}); app.controller('AppController',function ($scope) { $scope.title = "AppController title"; }); app.directive('sandBox',function ($log,$compile) { return { restrict: 'E',scope: { title: "@" },controller: function ($scope,$element,$attrs) { $scope.title = "Directive Controller title"; },template: '<h1>Template</h1>',// change it to: '' and Run,than change Angular to 1.2.x compile: function (tElement,tAttrs) { tElement.append('<h2> Title = {{ title }}</h2>'); } } });
当你运行它时,你得到:
模板
但是当你将模板更改为空字符串时,你会得到Angular 1.2:
Title = AppController标题
并使用Angular 1.1.1:
我的问题:
为什么在设置模板时和未设置模板时访问范围有所不同?
为什么Angular 1.1和1.2之间存在差异(bug? – 没有’template’的指令和isoleted范围加入控制器范围而非指令范围)?
如何在编译函数中构建访问Angular 1.2中的隔离范围而非父范围的模板?
为什么指令控制器功能不会使用$scope.title =“…”更改’title’ – 但是当’link’函数调用’scope’参数时,’title’值是’Directive Controler Title’但是它在内部(在哪里)寻找它)绑定isoleted范围’属性值’?
解决方法
1)当你的模板是“Angular时,看不到要应用隔离范围的模板.这是1.2中的问题的原因在于你的第二个问题的答案.
2)这是1.2破坏变化的结果 – make isolate scope truly isolate:
Isolate scope is Now available only to the isolate directive that requested it and its template.
因此,如果没有模板,您将附加到隔离范围之外的元素.
从https://github.com/angular/angular.js/issues/4889开始:
As we can’t distinguish markup that was originally in the html file
and markup that was added in the compile function the latter also
doesn’t get the isolate scope.
和
…additional markup in the compile function should be replaced by using
the template property.
The idea is that the template property can also be a function. If it
is one,it will get the compile element and the compile attributes as
parameters.
3)如上所述,Angular(1.2之后)实际上是试图让你在这里使用模板而不是编译函数.您最好的选择可能是以您使用编译的方式使用模板功能.或者,您可以使用带有$compile的链接函数,但这可能会增加不必要的复杂性.
通过在编译函数中附加内容,您实际上只是添加到模板中,因此它可以解决这个问题.
4)这与@的工作方式有关.从Angulars guide to scopes:
use attrs.$observe(‘attr_name’,function(value) { … } in the linking
function to get the interpolated value of isolate scope properties
that use the ‘@’ notation. E.g.,if we have this in the linking
function — attrs.$observe(‘interpolated’,function(value) { … } —
value would be set to 11. (scope.interpolatedProp is undefined in the
linking function. In contrast,scope.twowayBindingProp is defined in
the linking function,since it uses the ‘=’ notation.)
版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。