我从SQLite获取数据并将其分配给我的$ scope.loans:
$('#CDRTABLE #'+i).toggle(); // # not .
在我看来,我试图将数据绑定到输入标签,以便用户可以编辑和提交更改(我使用pug模板引擎)
{
"id": 1,
"book_id": 2,
"patron_id": 3,
"loaned_on": "2016-12-28",
"return_by": "2017-01-25",
"returned_on": "2017-01-17",
}
{
"id": 2,
"book_id": 3,
"patron_id": 4,
"loaned_on": "2016-12-28",
"return_by": "2017-01-25",
"returned_on": null,
}
现在我收到AngularJS错误,说ngModel不是日期对象。
我知道我应该使用日期构造函数将日期字符串转换为日期对象,但我的问题是这样做的最佳方法是什么?
我想也许我会找到一个更好的方法,但我没有。 所以我遍历loan数组并为每个日期字符串分配一个日期对象。
答案 0 :(得分:0)
如果您的日期是此ISO 8601表单,则可以使用Date
的默认构造函数。
new Date("2017-01-25")
如果您想对日期进行一些计算,或者如果您想以其他格式传递日期,我建议您使用moment.js
:
var myDate = moment("2017-01-25", "YYYY-MM-DD");
var newDate = myDate.add(7, "days");
将Date
传递给HTML的最简单方法是在范围函数中传递它。通过这种方式,您只需在HTML中调用它即可。
控制器(使用日期构造函数):
$scope.createDate = function(dateString) {
return new Date(dateString);
};
控制器(moment.js
):
$scope.createDate = function(dateString) {
return moment("2017-01-25", "YYYY-MM-DD");
};
HTML(帕格模板):
td(type='date' ng-model='createDate(loan.loaned_on)' value='{{loan.loaned_on}}')
答案 1 :(得分:0)
你可以这样做,这很简单,内联。
td(type='date' ng-model='new Date(loan.loaned_on)' value='{{loan.loaned_on}}')
答案 2 :(得分:0)
您将输入类型指定为date
,但您将日期字符串分配给model
不期望的model
。而是将值转换为日期对象并按如下所示进行分配:
tbody
tr(ng-repeat='loan in loans')
td(type='date' ng-model='loan.loaned_on' value='{{new Date(loan.loaned_on)}}')
答案 3 :(得分:0)
试试这个:
var myApp = angular.module('myApp',[]);
myApp.controller('MyCtrl',function ($scope) {
$scope.loans = [{
"id": 1,
"book_id": 2,
"patron_id": 3,
"loaned_on": "2016-12-28",
"return_by": "2017-01-25",
"returned_on": "2017-01-17"
},
{
"id": 2,
"book_id": 3,
"patron_id": 4,
"loaned_on": "2016-12-28",
"return_by": "2017-01-25",
"returned_on": null
}];
});
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>
<div ng-app="myApp" ng-controller="MyCtrl">
<table>
<thead>
<tr>
<th>Loaned On</th>
<th>Return By</th>
<th>Returned On</th>
</tr>
</thead>
<tbody>
<tr ng-repeat='loan in loans'>
<td><input type='date' ng-model='loan.loaned_on' value='{{loan.loaned_on}}'/></td>
<td><input type='date' ng-model='loan.return_by' value='{{loan.return_by}}'/></td>
<td><input type='date' ng-model='loan.returned_on' value='{{loan.returned_on}}'/></td>
</tr>
</tbody>
</table>
</div>