$watch vs ng-change, ng-checked 등에 의한 각도 트리거 변경

$watch vs ng-change, ng-checked 등에 의한 각도 트리거 변경

현재 데이터 변경은 여러 가지 방법으로 모니터링할 수 있습니다.모델 변경을 트리거할 수 있습니다.$watch요소에 지시문을 추가하고 몇 가지 작업을 결합할 수 있습니다.

많은 경우에서 조금 혼란스럽기 때문에 각 변종의 장단점이 무엇인지, 그리고 언제 사용해야 하는지 궁금합니다.$watch제본과 같은 지시가 있을 때ng-change?

둘다요.$watch그리고.ngChange용도가 전혀 다릅니다.

스코프에 정의된 모델이 있다고 가정합니다.

$scope.myModel = [
    {
        "foo":"bar"
    }
];

이제, 어떤 변화가 있을 때마다 작업을 수행할 수 있습니다.myModel사용하다$watch:

$scope.$watch("myModel", function(newValue, oldValue){
    // do something
});

ngChange는 사용자가 입력을 변경했을 때 지정된 식을 평가하는 지시어입니다.

<select ng-model="selectedOption" ng-options="option for option in options" 
ng-change="myModel=selectedOption"></select>

간단히 말하면, 일반적으로는 바인드라이브를ngChangeHTML 요소로 이동합니다.하는 동안에$watch모델용입니다.

코드 /ngChange지시:

var ngChangeDirective = valueFn({
  require: 'ngModel',
  link: function(scope, element, attr, ctrl) {
    ctrl.$viewChangeListeners.push(function() {
      scope.$eval(attr.ngChange);
    });
  }
});

맞춰봐,ngChange컨트롤러가 필요합니다.ngModel뷰가 변경되면 바인딩된 식을 실행합니다.

즉, [$watch '모델' 후 작업]과 같은 번거로운 작업으로부터 여러분을 구해 주는 도우미 같은 것입니다.

퍼포먼스의 관점에서 보면, 1개라도 부족한 것이 있습니다.$watch걱정해야 할 표정.

다음과 같은 지시사항ng-change는, DOM 에의 데이터 바인딩에 사용됩니다. $watch는 변경을 수신하기 위해 JS 코드에서 사용됩니다.

DOM이 스코프의 변경에 영향을 받거나 DOM의 변경(필드 선택 등)이 스코프에 영향을 줄 필요가 있는 경우는, 디렉티브를 사용합니다.

범위 변경(예를 들어 ajax 요청)에서 JavaScript 액션을 트리거해야 하는 경우$watch컨트롤러(또는 서비스)에서 변경을 수신합니다.

양방향 데이터 바인딩을 원하는 경우ng-model모델 간 및 뷰 간 변경은 두 가지 방법으로 이루어집니다.그러나 뷰에서 모델로의 단방향 데이터 바인딩을 원하는 경우ng-change모델 간 간단한 단방향 데이터 바인딩을 원하는 경우 식을 사용할 수 있습니다.{{ like_this }}그러나 뷰에서 모델이 렌더링되는 방법을 훨씬 더 많이 제어하거나 뷰 이외의 다른 요소에 모델을 바인딩하려면$watch.

언급URL : https://stackoverflow.com/questions/19007281/angular-trigger-changes-with-watch-vs-ng-change-ng-checked-etc