3

双方向のデータバインディングが原因で、フィールドの更新が正しく行われていないようです。フィールドをクリックすると日付ピッカーが正常に起動しますが、日付を直接入力してフィールドを編集しようとすると、うまく機能しません。

問題を示すフィドルは次のとおりです。http://jsfiddle.net/vSNJF/

<input type="text" ng-model="name" ui-date-format='m/d/yy' ui-date>

ここで、Angular でのキーボード編集と標準の jquery UI 日付ピッカーの動作を比較してください: http://jqueryui.com/datepicker/

対話型カレンダーが閉じられるまで、ui-date でモデルの更新を遅らせるにはどうすればよいですか?

4

1 に答える 1

1

そこには非常に大きなディレクティブがあります。問題の原因を見つけるためにコード全体を調べる人がいるかどうかはわかりません。支援するために、Jquery UI とまったく同じように動作する、より単純な datepicker ディレクティブを残しますが、実装したすべての機能はありません。おそらく、この時点から開始して機能を追加すると、問題をデバッグしやすくなります。

ディレクティブは次のとおりです。

directive('datepicker', function() {
    return {
        restrict: 'A',
        require : 'ngModel',
        link : function (scope, element, attrs, ngModelCtrl) {
            $(function(){
               element.datepicker({
                    dateFormat:'dd/mm/yy',
                    onSelect:function (date) {
                        ngModelCtrl.$setViewValue(date);
                        scope.$apply();
                    }
                });
            });
        }
    }
});

これは、Plunkerとそれに関するブログ投稿です。

于 2013-06-17T20:21:28.893 に答える