Ich habe versucht, jquery zu schreiben, um datepicker bei Textklick mit versteckten Eingabebereich zu öffnen. Dies ist auch an mehreren Stellen erforderlich.Angularjs. ng-model wird nicht aktualisiert in datepicker
Folgendes ist mein HTML.
<div class="date-format">
<input class="hidden-date-picker" id="hidden-date1" type="hidden" ng-model="date1"/>
<a href="" class="date-picker" id="date1">{{date1 | date: 'dd MMM yyyy a'}}</a>
</div>
<div class="date-format">
<input class="hidden-date-picker" id="hidden-date2" type="hidden" ng-model="date2"/>
<a href="" class="date-picker" id="date2">{{date2 | date: 'dd MMM yyyy a'}}</a>
</div>
Folgende ist Javascript -
var app = angular.module('index-app', []);
app.controller('index-controller', function($scope) {
$scope.date1 = new Date(2016, 0, 1);
$scope.date2 = new Date();
$('.hidden-date-picker').each(function() {
$(this).datepicker({
changeYear: 'true',
changeMonth: 'true',
startDate: '07/16/1989',
firstDay: 1,
onSelect: function(dateText, inst) {
console.log($scope.$eval($(this).attr('ng-model')));
$scope.$eval($(this).attr('ng-model')).setTime(Date.parse(dateText));
console.log($scope.date1);
}
});
});
$('.date-picker').each(function() {
$(this).click(function (e) {
$('#hidden-' + $(this).attr('id')).datepicker('show')
e.preventDefault();
});
});
});
Es ist klar, von der Konsole ausgegeben, die scope.date1 $ auf die Auswahl des Datums von Plan geändert wird. Aber die Änderung wird nicht in der HTML-Seite widergespiegelt.
Nach der Verwendung von $ scope. $ Apply() konnte ich das Problem lösen. Aber immer noch, wenn ich irgendwo anders versuche. Es wird nicht funktionieren. –