Angularjs 在ng repeat中保留作用域(不需要子作用域)
我可能在概念上遗漏了一些东西,但我知道ng repeat会创建子作用域,但对于我的场景来说,这是不可取的。下面是一个场景。我有一个3路绑定到firebase数据集。该对象是具有n个子对象的对象。在我当前的代码结构中,我使用ng repeat迭代并使用自定义指令呈现这些对象。问题在于这些对象是“活动的”(这意味着它们是三向绑定的。最高级别的对象是用angularfire$bind绑定的) 因此,在我的例子中,一个简单的场景是ng repeat创建的范围没有与创建它的范围隔离Angularjs 在ng repeat中保留作用域(不需要子作用域),angularjs,angularjs-directive,angularfire,Angularjs,Angularjs Directive,Angularfire,我可能在概念上遗漏了一些东西,但我知道ng repeat会创建子作用域,但对于我的场景来说,这是不可取的。下面是一个场景。我有一个3路绑定到firebase数据集。该对象是具有n个子对象的对象。在我当前的代码结构中,我使用ng repeat迭代并使用自定义指令呈现这些对象。问题在于这些对象是“活动的”(这意味着它们是三向绑定的。最高级别的对象是用angularfire$bind绑定的) 因此,在我的例子中,一个简单的场景是ng repeat创建的范围没有与创建它的范围隔离 我正在寻找如何做到这一
我正在寻找如何做到这一点的想法?或者对其他方法的建议。您仍然可以访问repeat中的父范围。您只需使用$parent 控制器
app.controller('MainCtrl', ['$scope', function ($scope) {
$scope.someParentScopeVariable = 'Blah'
$scope.data = [];
$scope.data.push({name:"fred"});
$scope.data.push({name:"frank"});
$scope.data.push({name:"flo"});
$scope.data.push({name:"francis"});
}]);
HTML
<body ng-controller="MainCtrl">
<table>
<tr ng-repeat="item in data | filter: search">
<td>
<input type="text" ng-model="$parent.someParentScopeVariable"/>
<input type="text" ng-model="item.name">
</td>
</tr>
</table>
</body>
这不是一个完整的答案,但我可以帮助你解决angularFire部分,也许一位有棱角的大师可以帮你填补空白(参见//todo) 首先,不要试图共享范围。简单地将您想要的变量传递到子范围中。因为您需要3路绑定,所以可以使用
&
调用父作用域上的方法
例如,要设置此模式,请执行以下操作:
<div ng-repeat="(key,widget) in widgets">
<data-widget bound-widget="getBoundWidget(key)"/>
</div>
其中&boundWidget调用父$scope中的方法,如下所示:
.controller('ParentController', function($scope, $firebase) {
$scope.widgets = $firebase(/*...*/);
$scope.getBoundWidget = function(key) {
var ref = $scope.widgets.$child( key );
// todo, reference $scope.boundWidget in the directive??
ref.$bind(/*** ??? ***/);
};
});
现在您只需要有人填写//待办事项部分 我想你错过了
$watch
的那部分ng repeat
必须为每个项目创建子(非隔离)范围。也许与我们分享一些代码,并向我们展示您已经尝试过的内容。
.controller('ParentController', function($scope, $firebase) {
$scope.widgets = $firebase(/*...*/);
$scope.getBoundWidget = function(key) {
var ref = $scope.widgets.$child( key );
// todo, reference $scope.boundWidget in the directive??
ref.$bind(/*** ??? ***/);
};
});