데이터 변경 시 $watch가 실행되지 않음
(ui-bootstrap에서) ui-select2 드롭다운 모델에 대해 워치를 설정했습니다.이 시계는 로드에 따라 작동하지만 데이터 변경에 따라 작동되지 않으며 이유를 알 수 없습니다.
모델 변경을 $적용하지 않거나 (적어도 내 코드에서) 동등 비교를 위해 세 번째 파라미터를 사용하지 않는 것은 일반적인 문제가 아닙니다.
불이 붙으려면 어떻게 해야 하나요?
패스해 보다true세 번째 논거로서.$watch()
$watch(watchExpression, listener, objectEquality)
objectEquality(선택사항) – {subject=} – 참조가 아닌 동등성을 위해 개체를 비교합니다.
몇 가지 일을 고쳤어요.
http://plnkr.co/edit/5Zaln7QT2gETVcGiMdoW?p=preview
JS
var myMod = angular.module("myApp",[]).controller("MainController", function($scope){
$scope.myModel = {selectedId:null};
}).controller("DetailController",function($scope){
$scope.items = [1,2,3,4];
$scope.watchHitCount = 0;
$scope.$watch('myModel.selectedId', function(newVal, oldVal){
console.log(newVal + " " + oldVal);
$scope.watchHitCount++;
},true);
});
index.html
<body ng-app="myApp">
<div ng-controller="MainController">
<ng-include src="'detail.html'" ng-controller="DetailController"></ng-include>
</div>
</body>
디테일이요.html
<pre>watch hit: {{watchHitCount}}</pre>
<pre>selected value: {{myModel.selectedId}}</pre>
<select ng-model="myModel.selectedId" ui-select2="">
<option></option>
<option ng-repeat="item in items" value="{{item}}">{{item}}</option>
</select>
컨트롤러를 찾을 수 없다는 불만이 제기되었기 때문에 ng-app이라는 이름의 모듈과 컨트롤러가 정의되어 있다고 선언된 모듈에서 정상적으로 설정했습니다.
당신의 모델에 가치를 유지하기 위한 오브젝트도 추가했습니다.$scope 개체를 모델로 사용하는 것은 잘못된 관행입니다. 대신 스코프는 모델인 개체를 참조해야 합니다.
간단한 수정이 있습니다.단순 변수 대신 복잡한 오브젝트에 시계를 사용하는 것입니다.
예: (DON'T USE)
$scope.selectedType=1;//default
$scope.$watch(
function () {
return $scope.selectedType;
},
function (newValue, oldValue) {
if (!angular.equals(oldValue, newValue)) {
$scope.DoWork();
}
},
true);
단, 아래 사용
$scope.selecteditem={selectedType:1};
$scope.$watch(
function () {
return $scope.selecteditem.selectedType;
},
function (newValue, oldValue) {
if (!angular.equals(oldValue, newValue)) {
$scope.DoWork();
}
},
true);
「선택」에 주의해 주세요.두 번째 예에서는 스코프 변수뿐만 아니라 오브젝트 내부에 배치되어 있습니다.오래된 Angular 버전에서도 작동합니다.
controller-as 접근 방식을 사용하는 경우 다음과 같은 구문이 제시될 수 있습니다.
var myController = {
myValue: 1
};
$scope.$watch('$ctrl.myValue', function () {
...
}, true);
대신 필드를 다음과 같은 함수로 묶습니다.
var myController = {
myValue: 1
};
$scope.$watch(function () {
return myController.myValue;
}, function () {
...
}, true);
나한테 효과가 있었던 건
var ctrl = this;
this.$onInit = function () {
console.log("id " + ctrl.event.id);
};
https://docs.angularjs.org/guide/component#! 에서
언급URL : https://stackoverflow.com/questions/17795077/watch-not-firing-on-data-change
'programing' 카테고리의 다른 글
| jQuery.ajax 처리 계속 응답: "success:" vs.done? (0) | 2023.03.19 |
|---|---|
| Json에서 Protobuf로 변환하는 방법? (0) | 2023.03.14 |
| 스프링 부트(JPA 포함): @Entity를 다른 패키지로 이동 (0) | 2023.03.14 |
| JSON 문자열에서 반환된 Objective-C의 null 값 확인 (0) | 2023.03.14 |
| 여러 HOC 래퍼를 사용하여 React 컴포넌트를 내보내시겠습니까? (0) | 2023.03.14 |