Добавление даты в поле ввода даты Angular

У меня есть некоторая логика, которую я упростил в этом JSFiddle: http://jsfiddle.net/r7vyjg4h/ и это работает.

HTML:

<div ng-controller="MyCtrl">
<div ng-repeat="line in lines">
    <div style="display: inline-block">
      {{line.id}}
    </div>
    <div style="display: inline-block">
      <input type="text" ng-model="line.date" />
    </div>
  </div>
  <input type="button" ng-click="update()" value="update" />
</div>

ЯШ:

function MyCtrl($scope) {
    $scope.lines = [{
        id:"1",
        date: new Date()
      },{
        id:"2",
        date: new Date()
      },{
        id:"3",
        date: new Date()
      }
      ];
      var newDates = [{id:"1", date: new Date('10-10-2010 10:10:10')}, {id:"3", date: new Date('11-11-2011 11:11:11')}];

      $scope.update = function(){
        for(var i = 0; i < newDates.length;i++){
            for(var j = 0; j < $scope.lines.length; j++){
              if($scope.lines[j].id == newDates[i].id){
                  $scope.lines[j].date = newDates[i].date;
              }
            }
          }
      }

Для чего он выбирает некоторые даты из веб-запроса и должен добавить его в соответствующие поля в ng-repeat. Пока что все работает правильно.

Но когда я меняю тип ввода с текста на дату, ничего не происходит. Значения, которые я выбираю, верны, но элементы даты не обновляются.

http://jsfiddle.net/vd347sfa/

Что мне здесь не хватает? Я делаю что-то неправильно?

3 ответа

Решение

Спецификация ввода даты в HTML-5 основана на разделе 5.6 RFC3339, в котором указан формат даты, равный yyyy-MM-dd, (Примечание: это именно то сообщение об ошибке в консоли, когда вы запускаете jsfiddle). Вам просто нужно указать строку даты в правильном формате: http://jsfiddle.net/yxkvm0zm/1/

Вам нужно указать дату и время в правильном формате. правильный способ сделать это:

var newDates = [{id:"1", date: new Date('2010', '10', '10', '10', '10', '10')}, 
{id:"3", date: new Date('2011', '11', '11', '11','11','11')}];

формат такой:

new Date('yyyy', 'mm', 'dd', 'hh', 'mm', 'ss');

Причина, по которой это не отражается в поле ввода даты, заключается в том, что форматирование.

Поле ввода даты ищет формат mm/dd/yyyy и вы предоставляете 10-10-2010 10:10:10 в этом формате.

Вы можете использовать функцию для преобразования даты в toISOString() формат, и это должно сделать свое дело.

Там вы идете проверить это решение:

 var newDates = [{id:"1", date: new Date('10-10-2010 10:00:00').toISOString().substring(0, 10)},{id:"2", date: new Date('10-10-2010 11:00:00').toISOString().substring(0, 10)}, {id:"3", date: new Date('11-11-2011 12:00:00').toISOString().substring(0, 10)}];

http://jsfiddle.net/vd347sfa/3/

Другие вопросы по тегам