programing

내부 지시어에서 컨트롤러 모델 값 보기

skycolor 2023. 10. 9. 22:26
반응형

내부 지시어에서 컨트롤러 모델 값 보기

저는 각진 시청을 하려고 합니다.$viewValue명령어 내부의 컨트롤러에 대한 정보를 제공할 수 있습니다.

fiddle: http://jsfiddle.net/dkrotts/TfTr5/5/

function foo($scope, $timeout) {
    $scope.bar = "Lorem ipsum";

    $timeout(function() {
        $scope.bar = "Dolor sit amet";
    }, 2000);
}

myApp.directive('myDirective', function() {
    return {
        restrict: 'A',
        require: '?ngModel',
        link: function (scope, element, attrs, controller) {
            scope.$watch(controller.$viewValue, function() {
                console.log("Changed to " + controller.$viewValue);
            });
        }
    } 
});

$watch 기능은 컨트롤러 내부에서 2초 후에 수행된 모델 변경을 포착하지 못합니다.제가 무엇을 빠뜨리고 있나요?

$watch범위 내에서 감시할 속성의 "이름"을 승인합니다. 값을 감시하도록 요청하는 것입니다.보기로 바꿉니다.attrs.ngModel'바'를 돌려주는 거지scope.bar. 기존과 동일한 값을 얻거나 사용할 수 있습니다.scope[attrs.ngModel]그것은 말하는 것과 같습니다.scope["bar"]다시 말하지만, 다음과 같습니다.scope.bar.

scope.$watch(attrs.ngModel, function(newValue) {
    console.log("Changed to " + newValue);
});

사용자 271996의 의견을 명확히 하기 위해:scope.$eval객체 표기법을 전달할 수 있기 때문에 사용됩니다.ng-model속성, 즉 속성.ng-model="someObj.someProperty"그게 안 될 거야 왜냐면scope["someObj.someProperty"]유효하지 않습니다.scope.$eval해당 문자열을 실제 개체로 평가하는 데 사용됩니다.scope["someObj.someProperty"]된다scope.someObj.someProperty.

추가하고 싶었습니다: 1.2.x에서는 격리된 범위에서 위의 내용이 작동하지 않습니다.http://jsfiddle.net/TfTr5/23/

제가 생각해낸 해결책은 $watch도 기능을 사용할 수 있기 때문에 그것을 사용하여 컨트롤러에 액세스할 수 있다는 것이었습니다.

scope.$watch(
    function(){return controller.$viewValue},
    function(newVal, oldVal){
        //code
    }
)

작업 fiddle: http://jsfiddle.net/TfTr5/24/

다른 대안이 있다면 기꺼이 환영하겠습니다!

격리된 범위 내의 값을 바인딩하려면 두 가지 방법이 있습니다.격리된 범위가 없어도 사용할 수 있는 첫 번째 방법.방법은 다음과 같습니다.

1) 쓰임새$attrs.any_attribute(시계에 맞춰) 묶습니다.

2) 2 ways binding ('=') 메서드를 사용하여 리스너로 설정합니다.

예를 들어 더 많은 것을 원한다면 여기 멋진 기사가 있습니다.

http://www.w3docs.com/snippets/angularjs/bind-variable-inside-angularjs-directive-isolated-scope.html

모형 값에 대한 디바운스를 원할 경우 ng-model-option에서 디바운스 설정을 언급할 필요가 있습니다.

<input type="text" ng-model-options="{ debounce: 1000 }" ng-model="search"/>

예를 들어, 이 시계는 변경 후 1000ms 트리거되며 새로운 변경 시 재설정됩니다.

scope.$watch(attrs.ngModel, function(newValue) { });

https://docs.angularjs.org/api/ng/directive/ngModelOptions

언급URL : https://stackoverflow.com/questions/14567908/watch-controller-model-value-from-inside-directive

반응형