2

ng-repeatを使用すると、その場で新しい子スコープが作成されます。同じことを行う方法を探していますが、単一のオブジェクトを使用しています。

つまり、これの代わりに...

<div ng-controller="SomeController">
    <ul>
        <li>{{foo.bar}}</li>
        <li>{{foo.baz}}</li>
    </ul>
</div>

私はこのようなことをしようとしています:

<div ng-controller="SomeController">
    <ul ng-scope="foo">
        <li>{{bar}}</li>
        <li>{{baz}}</li>
    </ul>
</div>
4

2 に答える 2

3

この種のものは必要ありませんでしたが、ここに子スコープを作成するディレクティブがあります。

function RestrictScopeDirective() {
    return {
        scope: {src: "=restrictScope"}
    };
}

このスコープでは、$scope.src設定したものを参照します。

<div ng-controller="SomeController">
    <ul restrict-scope="foo">
        <li>{{src.bar}}</li>
        <li>{{src.baz}}</li>
    </ul>
</div>

これによりスコープを制限できますが、それでもニーズを再考する必要がある場合があります。これは通常、ウィジェットなどの特定の要件に対して行われます。

于 2013-01-27T10:01:33.833 に答える
1

ここに一種のソリューションがあります: http://plnkr.co/edit/Vd4YtCYcZKs9mMQLPK8v?p=preview

最初のアイデアは、属性で指定されたオブジェクトをディレクティブのスコープに複製することでした:

scope.$parent.$watch(attrs.scope, function(nv) {
           angular.extend(scope, nv);
        },true);

これはあまり効率的ではありませんが (オブジェクトが変更されるたびに、Angular はそのプロパティをスコープにコピーする必要があるため)、目的を達成するための簡単な方法です。

その考えの問題は、(外側のスコープから内側への) 一方向のバインディングしかないことです。

双方向バインディングがある場合は、ディレクティブのスコープの変更に対応して親に反映する必要があります。すこし：

 link: function(scope, element, attrs) {
    var watches = [];
    var unregister = scope.$parent.$watch(attrs.scope, function(nv) {
       watches.forEach(function(w) { w(); });
       watches.length = 0;
       for (var key in nv) {
         if (key) {
            scope[key] = nv[key];
            watches.push(scope.$watch(key, function(key)  { 
              return function(knv) {
              nv[key] = knv;
            };}(key)));
         }
       }
    },true);
    scope.$on('$destroy', function(){
       unregister();
    });
 }

それでも、コードを異なるパーシャル/ディレクティブ/などに分割する方が良いと思います...

于 2013-01-27T11:08:20.820 に答える