我使用$ watch来触发输入或选择标签的更改。一切都工作正常,但想要重构,而不是观察者使用ng-change指令。对于select标签是有效的,但对于输入类型它现在正在工作,函数不会被调用。
输入视图
<div>
<input date-range-picker type="text" ng-model="reviewvm.review.extDate"
ng-change="reviewvm.changed(reviewvm.review.extDate)"
options="{locale:{format: 'MM/DD/YYYY'}, singleDatePicker:true}" />
<span data-ng-click="reviewvm.openExitConfDatePicker()">
<i class="icon-calendar"></i>
</span>
</div>
选择视图
<select ng-change="reviewvm.agencyChanged(reviewvm.agency)"
data-ng-model="reviewvm.agency" data-ng-options="agency as agency.agencyName for agency in reviewvm.refAgencies track by agency.id"">
<option value="">Select {{reviewvm.area}} Department or Agency</option>
</select>
功能
reviewvm.changed = changed;
function changed(current, original) {
console.log(current + " - " + original);
}
function agencyChanged(current, original) {
console.log(current + " - " + original);
}
正如我所说的选择和输入的方法相同,但是对于输入它不会在函数内部改变....
Plunker
https://plnkr.co/edit/STyQT4SivGuAdzy5ADGl?p=preview
更新
<div data-ng-class="{'not-allowed input-group' : !reviewvm.userReviewAssoc || !reviewvm.editMode, 'input-group' : reviewvm.userReviewAssoc}" data-ng-show="reviewvm.review.actualStartDt">
<input id="extConfDate" class="form-control date-picker" date-range-picker data-ng-disabled="!reviewvm.userReviewAssoc || !reviewvm.editMode" type="text"
ng-model="reviewvm.review.exitConfDt" ng-change="reviewvm.exitConfChanged(reviewvm.review.exitConfDt)"
min="reviewvm.review.actualStartDt" max="reviewvm.currDate" placeholder="mm/dd/yyyy" options="{locale:{format: 'MM/DD/YYYY'}, singleDatePicker:true}" />
<span data-ng-class="{'not-allowed input-group-addon' : !reviewvm.userReviewAssoc || !reviewvm.editMode, 'input-group-addon' : reviewvm.userReviewAssoc}" data-ng-click="reviewvm.openExitConfDatePicker()">
<i class="icon-calendar"></i></span>
</div>
function exitConfChanged(current, original) {
console.log(current)
}
这就是我如何使用当前和原始的下拉列表工作:
ng-change="reviewvm.reviewTypeChanged(reviewvm.review.reviewType, '{{reviewvm.review.reviewType}}')"
然后在控制器中:
function reviewTypeChanged(original, current) {
if (original !== "") {
original = angular.fromJson(original);
}
console.log(original + " - " + current);
}
这适用于所有下拉列表我正在获取当前和之前的选项,但输入不是......
我认为也许它不会进入angular-daterangepicker的这个错误的函数内部:
TypeError: Cannot read property 'startDate' of null
at Array.<anonymous> (angular-daterangepicker.js:93)
at Object.ngModelWatch (angular.js:23555)
at Scope.$digest (angular.js:14404)
at Scope.$apply (angular.js:14675)
at done (angular.js:9725)
at completeRequest (angular.js:9915)
at XMLHttpRequest.requestLoaded (angular.js:9856)(anonymous function) @ angular.js:11706(anonymous function) @ angular.js:8619$digest @ angular.js:14430$apply @ angular.js:14675done @ angular.js:9725completeRequest @ angular.js:9915requestLoaded @ angular.js:9856
但不知道如何修复它因为我在互联网上搜索很多人都有同样的错误但仍无法解决...
答案 0 :(得分:1)
你不应该在ng-change表达式中使用{{}}
。
ng-change="reviewvm.agencyChanged(reviewvm.agency, (reviewvm.agencye || 'null'))"
仍然想知道将'null'作为字符串的任何特殊原因吗?