CODEWITHSUNDEEP
javascriptangularjsangular-material
DasPete
DasPete

Reputation: 851

set md-datepicker in ng-repeat

I have a table that is created using ng-repeat. Within that table I have an md-datepicker. Some of the rows will have a date set for in the format yyyy-mm-dd. I would like to pre-set the datepicker to that value if it exists. How should I go about doing that? Here's the code: 

<tr ng-repeat="y in rides | orderBy : 'id'">
    <td >{{y.Student}}</td>
    <td>{{y.Instructor}}</td>
    <td><md-datepicker ng-model="myDate" md-placeholder="Enter date" ng-change="dateChange(myDate, $index)"></md-datepicker></td>
</tr>

I tried adding ng-init="myDate = y.Date" to my repeat but this didn't do the trick.

Upvotes: 1

Views: 458

Answers (1)

Sachila Ranawaka
Sachila Ranawaka

Reputation: 41387

just add ng-model = "y.Date"

<md-datepicker ng-model="y.Date" md-placeholder="Enter date" ng-change="dateChange(myDate, $index)"></md-datepicker>

Edited

create filter to convert string to date 

.filter('formatDate', function() {
    return function(obj) {
      debugger;
        obj.Date = new Date(obj.Date);
        return obj;
    }
})

call that filter from ng init to convert string to date 

<tr ng-repeat="y in rides | orderBy : 'id'" ng-init=" y | formatDate ">
   <td>{{y.id}}</td>
   <td>
      <md-datepicker ng-model="y.Date" md-placeholder="Enter date" ng-change="dateChange(myDate, $index)"></md-datepicker>
   </td>
</tr>

Demo

Upvotes: 1

Related Questions