html5 type=“date” 在 AngularJS 中不与 ngmodel 一起显示

html5 type="date" do not show with ngmodel in AngularJS

本文关键字:ngmodel 显示 一起 AngularJS type date html5      更新时间:2023-09-26

未绑定到input[type=date]的日期

(function(){
var app = angular.module('tableApp',[ ]);
app.controller('tableController', function($scope){
	$scope.items = [
	    { date: '12-March-2013', rate: 12.35, name: 'Konu konu'},
	    { date: '1-January-2011', rate: 60.54, name: 'Maanu meenu'},
	    { date: '12-December-2014', rate: 12.56, name: 'Konu konu'},
	    { date: '14-November-2014', rate: 0.99, name: 'Konu konu'},
	    { date: '2-November-2014', rate: 4.00, name: 'Konu konu'},
	    { date: '16-February-2014', rate: 6.54, name: 'Konu konu'},
	    { date: '30-November-2014', rate: 60.32, name: 'Konu konu'},
	    { date: '5-May-2014', rate: 5.12, name: 'Konu konu'},
	    { date: '12-April-2014', rate: 8.99, name: 'Konu konu'},
	    { date: '18-November-2014', rate: 34.54, name: 'Manjeri mmanjeri'},
	    { date: '28-June-2014', rate: 55.12, name: 'Konu konu'},
	    { date: '21-June-2014', rate: 99.54, name: 'Maanu meenu'},
	    { date: '31-December-2014', rate: 15.50, name: 'Maanu meenu'},
	    { date: '1-November-2014', rate: 34.05, name: 'Konu konu'},
	    { date: '3-November-2014', rate: 45.00, name: 'Maanu meenu'}
	];
});
})();
<link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.1/css/bootstrap.min.css" rel="stylesheet"/>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>
<div class="container" ng-app="tableApp">
  <table class="table table-striped table-hover" ng-controller="tableController">
    <thead>
      <tr>
        <th>Date</th>
        <th>Amount</th>
        <th>Member</th>
      </tr>
    </thead>
    <tbody>
      <tr ng-repeat="item in items | orderBy : 'rate'">
        <td>
          <input type="date" ng-model="item.date">
        </td>
        <td>
          <input type="text" ng-model="item.rate">
        </td>
        <td>
          <input type="text" ng-model="item.name" >
        </td>
      </tr>
    </tbody>
  </table>
</div>

日期应该是javascript日期对象引用

请注意,此功能在较旧的 Angular 版本中不起作用。 其工作角度 1.3 及更高

版本

所以你可以尝试像angular-ui引导程序日期选择器这样的东西