각도의 지시자 컨트롤러와의 양방향 데이터 바인딩

각도를 사용하면 지시문의 범위로 양방향 데이터 바인딩을 설정할 수 있습니다. 누구든지 지침의 컨트롤러로 양방향 데이터 바인딩을 설정하는 쉬운 방법을 알고 있습니까? 예를 들어각도의 지시자 컨트롤러와의 양방향 데이터 바인딩

: MyCtrl의 test 변수 위의 예에서 http://plnkr.co/edit/TIxXrvYpP0na4xEeYLgS?p=preview

HTML

<body ng-app="myApp" ng-controller="MyCtrl as ctrl"> 
    Controller Test: {{ctrl.test}} 
    <div dir test="ctrl.test"></div> 
</body>

JS는

var MyCtrl = function($timeout) { 
    this.test = {msg: 'hello'}; 
    var _this = this; 

    $timeout(function() { 
    _this.test = {msg: 'good bye'}; 
    }, 1000); 
} 

angular.module('myApp', []).directive('dir', function() { 
    return { 
    scope: { 
     test: '=' 
    }, 
    template: '\ 
     <div>Directive Scope Test: {{test}}</div>\ 
     <div>Directive Controller Test: {{dCtrl.test}}</div>', 
    controller: function($scope) { 
     this.test = $scope.test; 
    }, 
    controllerAs: 'dCtrl' 
    } 
});

dir 지정 범위에 결합된다. 그러나 변수가 지시문의 컨트롤러 (this.test = $scope.test;)에 할당되면 양방향 바인딩이 끊어집니다.

"controller as"구문을 사용할 때 스코프 변수와 컨트롤러 변수 사이를왔다 갔다하려는 것이 조금 어색하기 때문에 컨트롤러에 스코프 변수를 할당합니다. 그러나 내가 생각할 수있는 최상의 솔루션은 바로 $scope의 변수에 직접 액세스하는 것입니다. 누구든지 "컨트롤러"스타일 컨트롤러와 더 잘 맞는 솔루션을 갖고 있습니까?

출처

2014-09-23 rob

내 의견으로는 각도 1.2. *로 작업 할 때 유일한 방법입니다. 그러나 구체적인 경우에는 지시기 컨트롤러 인스턴스에서 이전 참조를 보유하고 있습니다 (컨트롤러에서 참조를 덮어 쓰는 것이므로 by test 속성을 완전히 수행하여 _this.test = {msg: 'good bye'};), 지시어 컨트롤러 인스턴스가 이전 컨트롤러 인스턴스를 보유하고 있기 때문에 (변경 사항이 반영되지 않음).

대신에 _this.test.msg = 'good bye';을 입력하면이 경우 개체 참조를 덮어 쓰지 않으므로 변경 내용이 반영됩니다. Plnkr

당신이 시계를 통해 그것을 처리하지 않는 한, 컨트롤러 인스턴스 2 웨이 바인딩 범위 속성을 부착 또는 당신이 그것을 할 도움이 될 몇 가지 문법 설탕을 사용하는 자동적 인 방법은 없습니다.

1.3 rc로 업그레이드하면 속성이 컨트롤러 인스턴스에 자동으로 연결되고 범위에는 직접 연결되지 않도록 설정할 수있는 bindToController:true 속성이 있습니다. 궁극적으로 컨트롤러 별칭은 스코프에 첨부됩니다. 내가 찾던 정확히 무엇을

Plnkr

출처

2014-09-23 23:50:57 PSL

. 감사! 이것은 비늘을 기울일 수 있고 나를 1.3으로 바꾸게 할 수 있습니다. – rob

@rob 환영합니다 .. 내 새로운 프로젝트에서 업그레이드하게 해주는 더 많은 훌륭한 기능이 있습니다. :) – PSL

각도의 지시자 컨트롤러와의 양방향 데이터 바인딩

답변

관련 문제