角引导装载日期字段插入HTML [英] Angular bootstrap loading a date field into the html

问题描述

我有一个角应用，在那里我是从服务中获取数据。

I have an angular app where i am getting data from a service.

我的控制器a​​pp.js如下：

My controller app.js is as follows:

var app = angular.module('myapp', ['ui.bootstrap', 'jsonService']);
    app.controller('mycontroller', function(MyService, $scope, $modal, $log, $http) {
        $scope.profileid=3619;

        MyService.getItems($scope.profileid,function(data){
            $scope.profiledata = data;
        });
    });

JSON对象我在数据获取如下所示：

The json object i get in the data looks as follows:

[
    {
        "profile_id": 3619, 
        "student_id": "554940", 
        "first_name": "Samuel", 
        "last_name": "Haynes",
        "date_of_birth": "2002-03-08T06:00:00Z"
    }
]

下面的 DATE_OF_BIRTH 是日期时间的领域。当我试图在一个HTML显示这些值如下：

Here the date_of_birth is a DateTime field. When i am trying to display these values in a html as follows :

<label for="lastName">Student Last Name</label>
<input type="text" class="form-control" id="lastName" ng-model="profiledata[0].last_name" placeholder="Last Name" />

<label for="dob">Date of Birth</label>
<input type="date" class="form-control" id="dob" ng-model="profiledata[0].date_of_birth" />

在这里，最后一个名称将显示在文本框中的罚款。但日期无法正常工作。我如何日期显示的值？

Here, the last name displays fine in the textbox. But the date does not work. How do i display the values for the date?

推荐答案

为了为日期输入摄取的价值，它首先必须转换为一个javascript Date对象。因此，在这种情况下，您将添加行 $ scope.profiledata [0] = .date_of_birth新的Date（$ scope.profiledata [0] .date_of_birth）; 后，立即 $ scope.profiledata =数据; 行

In order for the date input to ingest the value, it first must be converted to a javascript Date object. So in this case, you would add the line $scope.profiledata[0].date_of_birth = new Date($scope.profiledata[0].date_of_birth); immediately after the $scope.profiledata = data; line.

这篇关于角引导装载日期字段插入HTML的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！