Angularjs 수동 양방향 바인딩

Question

내 문제를 설명하는 가장 좋은 방법은 데모입니다. 이것은 내가 내 지시어를 사용하는 방법입니다 :

'obj가'나는 양방향에 바인딩 원하는 범위의 개체입니다

<my-directive my-attr="{'property': obj}"></my-directive> 

. 잡기는 객체 'obj'의 이름을 알아야합니다.

제가 생각해내는 부분적인 해결책은 객체 ('obj')의 이름을 문자열로 전달하고 $ parse를 사용하여 객체를 가져 오는 것입니다. 그러나 이것이 '='스코프를 사용하는 것과 같은 방식으로 $ parent 스코프에 영향을 미치지 않을 때. 내 범위의 개체를 변경하면 부모 범위의 개체가 변경되도록 양방향 바인딩을 수동으로 작성할 수 있습니까?

Answer 1

에 고립 된 범위를 사용하지 않기 때문에

scope[ attrs.myAttr] 

부모 범위 속성에 액세스 할 수 있습니다. (커피 스크립트에서) 내 솔루션 :

$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 

이 범위의 체인을 확인하고 객체에 정의 된 하나를 발견하고 거기를 수정합니다. 나는 이것이 범위를 사용하는 것과 거의 동일한 행동이라고 생각한다 : 지시어 정의에서 '='.

Answer 2

이 개체 구문을 사용할 수 있습니다 : 당신이 지시

내 문제를 해결하기 위해 관리

Answer 3

꽤 연구 한 후에, 그리고 following issue을 참조하여, 여기에 (만 외부 nodeLinkFn 작동하도록 수정은, 본질적으로, 각 코드) 양방향 바인딩을 허용 범위의 확장이다 :

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);  
    } 

}]); 

클라이언트는 다음을 호출해야합니다.

범위. $ bindTwoWay ('childModelName', 'parentModelName');