Угловой материал — средство выбора даты

Может ли кто-нибудь объяснить, почему Datepicker ожидает, что значение будет объектом даты в соответствии с официальным примером? https://material.angularjs.org/latest/demo/datepicker

Честно говоря, это боль, потому что перед привязкой ответа сервера к форме я должен определить, является ли поле типом данных, и преобразовать значение:

$scope.myDate = new Date('2015-01-11');

Есть ли способ просто заполнить datepicker строковым значением?

$scope.myDate = '2015-01-11'; 

person Adam Bubela    schedule 16.05.2016    source источник
comment
Извините, если мой вопрос был неясен. Я имел в виду, что стандартное средство выбора даты HTML принимает нормализованный формат даты ГГГГ-ММ-ДД, например. <input type="date" name="bday" max="1979-12-31" value="1954-11-13"> Очень легко привязать к нему значение JSON/AJAX прямо из ответа сервера.   -  person Adam Bubela    schedule 17.05.2016


Ответы (1)


Проблема со строковым значением будет заключаться в разборе. 10 мая 2016 г. и 5 октября 2016 г. можно спутать. 2016-05-10 или 2016-10-05. Объект даты защищает от этого. Не можете ли вы использовать определенный фильтр для преобразования ваших строковых данных в объект даты?

Я быстро изменил приведенный ниже код из фильтра даты, который у меня есть для Angular 1.x, который использует числовой формат даты ГГГГММДД (20160516).

/**
 * @name yourDate
 * @ngdoc filter
 * @requires $filter
 * @param DateValue {string} Date Value (YYYY-MM-DD)
 * @returns Date Filter with the Date Object
 * @description
 * Convert date from the format YYYY-MM-DD to the proper date object for future use by other objects/filters
 */
angular.module('myApp').filter('yourDate', function($filter)    {
        var DateFilter = $filter('date');
        return function(DateValue) {
            var Input = "";
            var ResultData = DateValue;
            if ( ! ( (DateValue === null) || ( typeof DateValue == 'undefined') ) ) {
                if ( Input.length == 10)    {
                    var Year = parseInt(Input.substr(0,4));
                    var Month = parseInt(Input.substr(5,2)) - 1;
                    var Day = parseInt(Input.substr(8, 2));
                    var DateObject = new Date(Year, Month, Day);

                    ResultData = DateFilter(DateObject);            // Return Input to the original filter (date)
                } else {
                }
            } else {
            }
            return ResultData;
        };
    }
);

/**
 * @description
 * Work with dates to convert from and to the YYYY-MM-DD format that is stored in   the system.
 */
angular.module('myApp').directive('yourDate',
    function($filter) {
        return {
            restrict: 'A',
            require: '^ngModel',
            link: function($scope, element, attrs, ngModelControl) {
                var slsDateFilter = $filter('yourDate');

                ngModelControl.$formatters.push(function(value) {
                    return slsDateFilter(value);
                });

                ngModelControl.$parsers.push(function(value) {
                    var DateObject = new Date(value);                   // Convert from Date to YYYY-MM-DD
                    return DateObject.getFullYear().toString() + '-' + DateObject.getMonth().toString() + '-' + DateObject.getDate().toString();
                });
            }
        };
    }
);

Этот код просто использует стандартные параметры Angular Filter, поэтому вы сможете комбинировать это с вашим средством выбора даты Material.

person Steven Scott    schedule 16.05.2016