Question

使用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>

Answer 1

我从来不需要这种类型的东西，但这是一个创建子范围的指令。

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>

这可以限制您的范围，但是，您可能需要重新考虑您的需求，这通常是针对特定需求而完成的，例如小部件或类似的东西。

Answer 2

这是一种说法：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();
    });
 }

我认为最好将代码分成不同的部分/指令/等等......

AngularJS中是否有用于在标记中创建子范围的简写？

2 个答案: