0

テンプレート化にディレクティブを使用しようとしていますが、残念ながら、各ディレクティブはテンプレートおよびコントローラー/リンク関数の個々のスコープを設定しているようです。

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 です。

4

1 に答える 1

0

両方からテンプレート属性を削除するだけです。

編集: この特定のテンプレートでは、transclusion が、親から継承する分離スコープに兄弟スコープを作成することに注意してください。テキストは、transcluded スコープを使用するため、isolate スコープからの値を認識していません。

DOM に切り替える{{someValue}}と{{isolated}}、何が起こっているのかがわかると思います。

于 2013-11-01T15:07:02.173 に答える