md-data-table排序不适用于日期

时间:2018-04-03 06:46:04

标签: javascript angularjs angular-material

我正在尝试对日期列进行排序,该日期列位于" MM-DD-YYYY HH:mm:ss"格式。但排序顺序不正确。看起来它是根据月份和时间排序日期而不是年份。

Codepen - https://gist.github.com/hrules6872/b68bf3762e4d1243e480#file-spaceitemdecoration-java

HTML代码段

<md-table-container>
    <table md-table md-row-select="options.rowSelection" multiple="{{options.multiSelect}}" ng-model="selected" md-progress="promise">
        <thead ng-if="!options.decapitate" md-head md-order="query.order" md-on-reorder="logOrder">
            <tr md-row>
                <th md-column md-order-by="name"><span>Dessert (100g serving)</span></th>
                <!--                 <th md-column md-order-by="type"><span>Type</span></th> -->
                <th md-column md-order-by="dateTime"><span>Date</span></th>
                <th md-column md-numeric md-order-by="calories.value" md-desc><span>Calories</span></th>
                <th md-column md-numeric md-order-by="fat.value"><span>Fat (g)</span></th>
                <!--                 <th md-column md-numeric md-order-by="carbs.value"><span>Carbs (g)</span></th>
                <th md-column md-numeric md-order-by="protein.value"><span>Protein (g)</span></th> -->
                <th md-column md-numeric md-order-by="sodium.value" hide-gt-xs show-gt-md><span>Sodium (mg)</span></th>
                <th md-column md-numeric md-order-by="calcium.value" hide-gt-xs show-gt-lg><span>Calcium (%)</span></th>
                <th md-column md-numeric md-order-by="iron.value" hide-gt-xs show-gt-lg><span>Iron (%)</span></th>
                <th md-column md-order-by="comment">
                    <md-icon>comments</md-icon>
                    <span>Comments</span>
                </th>
            </tr>
        </thead>
        <tbody md-body>
            <tr md-row md-select="dessert" md-on-select="logItem" md-auto-select="options.autoSelect" ng-disabled="dessert.calories.value > 400" ng-repeat="dessert in desserts.data | filter: filter.search | orderBy: query.order | limitTo: query.limit : (query.page -1) * query.limit">
                <td md-cell>{{dessert.name}}</td>
                <!--                 <td md-cell>
                  <md-select ng-model="dessert.type" placeholder="Other">
                    <md-option ng-value="type" ng-repeat="type in getTypes()">{{type}}</md-option>
                  </md-select>
                </td> -->
                <td md-cell>{{dessert.dateTime}}</td>
                <td md-cell>{{dessert.calories.value}}</td>
                <td md-cell>{{dessert.fat.value | number: 2}}</td>
                <!--                 <td md-cell>{{dessert.carbs.value}}</td>
                <td md-cell>{{dessert.protein.value | number: 2}}</td> -->
                <td md-cell hide-gt-xs show-gt-md>{{dessert.sodium.value}}</td>
                <td md-cell hide-gt-xs show-gt-lg>{{dessert.calcium.value}}%</td>
                <td md-cell hide-gt-xs show-gt-lg>{{dessert.iron.value}}%</td>
                <td md-cell ng-click="editComment($event, dessert)" ng-class="{'md-placeholder': !dessert.comment}">
                    {{dessert.comment || 'Add a comment'}}
                </td>
            </tr>
        </tbody>
    </table>
</md-table-container>

1 个答案:

答案 0 :(得分:0)

将字符串日期转换为js日期对象 - new Date()后尝试。如果数据来自服务器端,您可以在那里进行转换。