Question

我正在使用Angular 1.6，我想直接将字符串绑定到date类型的输入，而不是必须将日期转换为Date，然后绑定到输入。原因是我从服务器获取JSON（以及其他数据）并且我不想仅为日期创建中间变量，我想直接使用JSON，因此我可以按原样POST回我的JSON当输入字段中有修改并且不需要使用ng-change和转换日期并将其放入我的JSON等时......我有plunkered我的问题。

这是html：

<body ng-app="plunker" ng-controller="MainCtrl">
  <form name="myForm">
    <label for="exampleInput">Date input</label>
    <input type="date" id="exampleInput" name="input" ng-model="date" placeholder="yyyy-MM-dd"/>
  </form>
</body>

这是javascript：

var app = angular.module('plunker', []);
app.controller('MainCtrl', function($scope) {
  $scope.dateString = '2017-01-31';
  $scope.date = new Date(2017, 11, 31);
});

如果我将输入绑定到变量$ scope.date就可以，但是如果我将它绑定到变量$ scope.dateString则为KO。

Answer 1

您可以使用输入的值属性来执行此操作：

angular
  .module('plunker', [])
  .controller('MainCtrl', function($scope) {
    $scope.dateString = '2017-01-31';
    $scope.date = new Date(2017, 11, 31);
  })
;

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>

<section ng-app="plunker" ng-controller="MainCtrl">
  
  <form name="myForm">
    <label for="exampleInput">Date input</label>
    
    <input 
      type="date" value="{{dateString | date : 'yyyy-MM-dd'}}" 
      ng-model="dateString" placeholder="yyyy-MM-dd"
    />
  </form>
  
</section>

Answer 2

Placeholder属性不适用于输入类型日期。您可以通过将输入类型更改为文本来实现此目的。

  <input type="text" onfocus="(this.type='date')" placeholder="{{some_date_holder}}"/>

Read this了解更多详情。

角度绑定字符串日期为输入类型日期

2 个答案: