Question

我正在尝试使用指令进行模板化，但不幸的是，每个指令似乎都为模板和控制器/链接函数设置了各个范围。

plnkr的示例：

<body ng-app="App">
    <h2>Directive with Isolating Scope</h2>
    <isolating some-value="isolated">{{someValue}}</isolating>

    <h2>Directive with Shared Scope</h2>
    <sharing some-value="shared">{{someValue}}</sharing>
</body>

var app = angular.module('App', []);

app.directive('isolating', function(){
  return {
    'restrict': 'E',
    'scope': {
      'someValue': '@'
    },
    'transclude': true,
    'template': '<div ng-transclude></div>',
    'link': function(scope, element, attrs){
      scope.someValue = attrs.someValue;
    }
  };
});

app.directive('sharing', function(){
  return {
    'restrict': 'E',
    'transclude': true,
    'template': '<div ng-transclude></div>',
    'link': function(scope, element, attrs){
      scope.someValue = attrs.someValue;
    }
  };
});

我对Batarang的看法:(括号中的指令名称）

< Scope (002)
    < Scope (003)    <= (isolating) contains the isolated scope
    < Scope (004)    <= (isolating) contains the template scope
    < Scope (005)    <= (sharing)   contains the shared scope

如何将隔离范围003用于模板？范围004似乎完全没必要。

AngularJS版本为1.2.0-rc3。

Answer 1

只需从两者中删除模板属性。

编辑：使用此特定模板，您应该注意到，transclusion会为从父级继承的隔离范围创建一个兄弟范围。该文本将使用transcluded范围，因此它不知道隔离范围的值。

如果您在DOM中将{{someValue}}切换为{{isolated}}，您会看到我认为发生了什么。

AngularJS：指令对模板和控制器/链接使用单独的范围

1 个答案: