给定一个返回json值的WebApi2服务,如下所示：
{
id: 1109,effectiveDate: "2014-10-05T00:00:00",// the date is a string (newtonsoft.json)
text: "Duis et rhoncus nibh. Cras rhoncus cursus diam",fundSource: "Test"
}
我需要日期正确地出现在bound angular / bootstrap / date picker中.
我需要在将日期绑定到输入框时将日期转换为格式yyyy-mm-dd(没有时间).
只是指向一些文档的指针,解释了将API中的日期序列化为角度的正确方法.我确信effectiveDate实际上应该是Date对象而不是字符串.
<input class="form-control"
type="text"
name="effectiveDate"
ng-model="consultation.effectiveDate"
data-date-picker="yyyy-mm-dd"
placeholder="Date" />
对于completness,返回json值的服务如下所示：
app.factory('Service',['$http','$location','$interpolate',function ($http,$location,$interpolate) {
return {
get: function (account) {
var url = 'api/consultations/{account}';
return $http
.get(Api.format(url,{ account: account }))
.then(function (response) { return response.data; });
}
};
}]);
service.get($scope.urlData.account).then(function(consultations) {
$scope.consultations = consultations;
});
解决方法
如果你想以角度使用bootstrap组件,那么你必须创建一个指令,或者你可以重用一些像
http://angular-ui.github.io/bootstrap/#/datepicker这样的现有指令
示例如何使用带角度的引导日期选择器：
<body ng-app="app" >
<div class="form-horizontal" ng-controller="ctrl">
<input type="text" datepicker-popup="MM/dd/yyyy" ng-model="consultation.effectiveDate" datepicker-options="dateOptions" date-disabled="" ng-required="true" />
</div>
</body>
JS：
app.controller('ctrl',function ($scope,$timeout) {
$scope.consultation = {
id: 1109,fundSource: "Test"
};
$scope.dateOptions = {
'starting-day': 1
};
});
