데이터 변경시 $ watch가 실행되지 않음
ui-bootstrap에서 ui-select2 드롭 다운 모델에 대한 시계 설정이 있습니다. 시계는로드시 실행되지만 데이터 변경시에는 실행되지 않으며 이유를 알 수 없습니다.
모델 변경을 $ 적용하지 않거나 동등 비교를 위해 세 번째 매개 변수를 사용하지 않는 일반적인 문제가 아닙니다 (적어도 내 코드에서).
발사하려면 어떻게해야합니까?
몇 가지를 고쳤습니다.
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>
detail.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 개체를 모델로 사용하는 것은 좋지 않습니다. 대신 범위가 모델 인 개체를 참조해야합니다.
true세 번째 인수로 전달해보십시오..$watch()
$watch(watchExpression, listener, objectEquality)
objectEquality (선택 사항) – {boolean =} – 참조가 아닌 동일한 지 개체를 비교합니다.
간단한 변수 대신 복잡한 객체로 watch를 사용하는 간단한 수정이 있습니다.
예 : (사용하지 마십시오)
$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);
두 번째 예제에서 "slectedTypes"는 범위 변수뿐만 아니라 object 내부에 있습니다. 이것은 이전 Angular 버전에서도 작동합니다.
컨트롤러 방식을 사용하는 경우 일부 읽기는 다음과 같은 구문을 제안 할 수 있습니다.
var myController = {
myValue: 1
};
$scope.$watch('$ctrl.myValue', function () {
...
}, true);
대신 다음과 같은 함수로 필드를 감 쌉니다.
var myController = {
myValue: 1
};
$scope.$watch(function () {
return myController.myValue;
}, function () {
...
}, true);
참고URL : https://stackoverflow.com/questions/17795077/watch-not-firing-on-data-change
'IT TIP' 카테고리의 다른 글
| SQL Server에서 데이터 정렬이 다른 두 데이터베이스에서 조인을 수행하고 오류가 발생 함 (0) | 2020.12.13 |
|---|---|
| 뷰에서 컨트롤러의 메서드를 호출 할 수 있습니까 (이상적으로 헬퍼에서 호출)? (0) | 2020.12.13 |
| 타임 스탬프를 자바 스크립트에서 인간 날짜로 변환하는 기능 (0) | 2020.12.13 |
| 자바 스크립트를 통해 브라우저의 포커스 테두리 제거 또는 비활성화 (0) | 2020.12.13 |
| 펜촉이지만 UITableView를 얻지 못했습니다. (0) | 2020.12.13 |