Javascript Angularjs手动双向绑定
描述我的问题的最好方法是演示。我希望我的指令是这样使用的:Javascript Angularjs手动双向绑定,javascript,angularjs,Javascript,Angularjs,描述我的问题的最好方法是演示。我希望我的指令是这样使用的: <my-directive my-attr="{'property': obj}"></my-directive> 其中'obj'是作用域上我想要双向绑定的对象。问题是,我还需要获取对象“obj”的名称 我提出的部分解决方案是将对象“obj”的名称作为字符串传递,然后使用$parse获取对象。但是当这不影响$parent作用域时,使用作用域“=”将以同样的方式影响$parent作用域。如何手动编写双向绑定,以便
<my-directive my-attr="{'property': obj}"></my-directive>
其中'obj'是作用域上我想要双向绑定的对象。问题是,我还需要获取对象“obj”的名称
我提出的部分解决方案是将对象“obj”的名称作为字符串传递,然后使用$parse获取对象。但是当这不影响$parent作用域时,使用作用域“=”将以同样的方式影响$parent作用域。如何手动编写双向绑定,以便对我作用域上的对象所做的更改将更改父作用域上的对象?可以使用此对象语法:
scope[ attrs.myAttr]
要访问父作用域属性,因为您没有在指令中使用隔离作用域,我设法解决了我的问题。我在coffeescript中的解决方案:
$scope.$watch name, (val) ->
scope = $scope.$parent
# look up the scopes until the real object is found
while scope isnt null
if not scope.hasOwnProperty(name)
scope = scope.$parent
else
expressions[name].assign(scope, val)
scope = null
这将检查作用域链,找到定义对象的作用域,并在那里修改它。我相信这与在指令定义中使用scope:'='几乎是相同的行为。经过相当多的研究,并参考,这里有一个允许双向绑定的scope扩展,它本质上是角度代码,仅被修改为在nodeLinkFn之外工作: 客户只需致电:
范围。$bindtoway'childModelName','parentModelName' 为什么只放obj.name='thename'并使用我的attr=obj?对不起,我应该澄清一下,我使用的是隔离作用域。如果在隔离作用域中使用隔离作用域绑定=并在mrkup中创建相同的属性。在jsfiddle.net或plunker中创建一个演示,显示您的问题我解释说您试图避免使用=并因此试图避免孤立的作用域如果属性在树上的$parent数不多怎么办?您是否对解决方案进行了更深入的研究,因为我目前正在实现作用域。$bindtoway'FormErrors','viewModel.errors';,其中viewModel是树上的控制器名$parent,您的代码、$parse方法和$eval都不会向我返回未定义的值,就像引用不存在一样?
angular.module('scopeBindExtention', [])
.run( [ '$rootScope', '$parse', function( $rootScope, $parse ) {
var extended = angular.extend( $rootScope, {} );
extended.$bindTwoWay = function( scopeName, parentName ) {
var scope = this,
parentScope = scope.$parent;
lastValue,
parentGet,
parentSet,
compare;
parentGet = $parse(parentName);
if (parentGet.literal) {
compare = angular.equals;
} else {
compare = function(a,b) { return a === b; };
}
parentSet = parentGet.assign || function() {
// reset the change, or we will throw this exception on every $digest
lastValue = scope[scopeName] = parentGet(parentScope);
throw new Error( "Expression '" + parentName + "' is non-assignable!" );
/*
throw $compileMinErr('nonassign',
"Expression '{0}' is non-assignable!",
parentName);
*/
};
lastValue = scope[scopeName] = parentGet(parentScope);
var unwatch = parentScope.$watch($parse(parentName, function parentValueWatch(parentValue) {
if (!compare(parentValue, scope[scopeName])) {
// we are out of sync and need to copy
if (!compare(parentValue, lastValue)) {
// parent changed and it has precedence
scope[scopeName] = parentValue;
} else {
// if the parent can be assigned then do so
parentSet(parentScope, parentValue = scope[scopeName]);
}
}
return lastValue = parentValue;
}), null, parentGet.literal);
scope.$on('$destroy', unwatch);
}
}]);