在angular js中获取datepicker指令的值(get value of datepicker directive in angular js)

在angular js中获取datepicker指令的值(get value of datepicker directive in angular js)

这是我之前使用的代码......

<div class="date_menu" ng-repeat="singledate in dates"> <p> {{singledate}} <input type="radio" name="filterDateChosen2" ng-model="$parent.radioResult" ng-value="singledate"> </p> </div></div>

这以单选按钮的形式显示了日期列表。 这将所选日期保存在$parent.radioResult中，然后我可以使用它来访问它...

<button ng-click="getVar(radioResult)"...

但现在，我想使用jQuery datepicker代替......

myApp.directive('calendar', function () { return function(scope, element, attrs) { element.datepicker({ inline: true, dateFormat: 'dd-mm-yy', onSelect: function(dateText) { var modelPath = $(this).attr('ng-model'); var val = $(this).attr('ng-value'); putObject(modelPath, val, scope, dateText); scope.$apply(); } }); } });

这是有效的，如果我选择一个日期，输入框将显示它...

<input calendar ng-model="$parent.radioResult" />

但问题是，当我使用......

<button ng-click="getVar(radioResult)"...

它没有得到价值，我无法弄清楚为什么？ 这是什么原因？

This was the code I was using before...

<div class="date_menu" ng-repeat="singledate in dates"> <p> {{singledate}} <input type="radio" name="filterDateChosen2" ng-model="$parent.radioResult" ng-value="singledate"> </p> </div></div>

This displayed a list of dates in the form of radio buttons. This saved the selected date in $parent.radioResult where I was able to then access it with...

<button ng-click="getVar(radioResult)"...

But now, I want to use jQuery datepicker instead...

myApp.directive('calendar', function () { return function(scope, element, attrs) { element.datepicker({ inline: true, dateFormat: 'dd-mm-yy', onSelect: function(dateText) { var modelPath = $(this).attr('ng-model'); var val = $(this).attr('ng-value'); putObject(modelPath, val, scope, dateText); scope.$apply(); } }); } });

This works, if I select a date, the input box will show it...

<input calendar ng-model="$parent.radioResult" />

But the problem is, when I use...

<button ng-click="getVar(radioResult)"...

It does not get the value, and I cannot figure out why? What is the reason for this?

最满意答案

由于您使用的是不在Angular上下文中的JQuery Datepicker，因此您需要首先将所选日期设置为范围内的变量，如下所示将其置于Angular的上下文中

$scope.$apply(function () { $scope.dateValue = selectedDate; });

Since you are using a JQuery Datepicker which is not in the Angular context so you need to bring it into the Angular's context first by setting the selected date to the variable on the scope like below

$scope.$apply(function () { $scope.dateValue = selectedDate; });