2015-03-05 3 views
1

У меня есть даты в этом формате в моем json «26 февраля 2015 00:00:00», который я хотел бы преобразовать в день недели, т.е. Tue Это кажется простым использованием momentjs, но мой вопрос, как назвать формат momentjs() метод внутри HTML VS. внутри < сценария> Я предполагаю, что я могу создать новую строку JSON внутри сценария, но хотел бы избежать этогокак преобразовать дату в день недели с помощью momentjs и angularjs

<!DOCTYPE html> 
<html> 
<script src="https://cdnjs.cloudflare.com/ajax/libs/moment.js/2.9.0/moment.js"></script> 
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script> 
    <body ng-app="test" ng-controller="test"> 
    <table> 
    <tr><th>day</th><th>value</th></tr> 
    <tr ng-repeat="tsval in data['key']"> 
     <td>{{tsval.timestamp }}</td> 
     <td>{{ tsval.val }}</td> 
    </tr> 
    </table> 
    </body> 
    <script> 
angular.module('test', []).controller('test', function($scope) { 
    $scope.data = { 
     'key':[ 
     { 
      'timestamp':'26 Feb 2015 00:00:00 GMT', 
      'val':'v1' 
     }, 
     { 
      'timestamp':'27 Feb 2015 00:00:00 GMT', 
      'val':'v2' 
     }, 
     { 
      'timestamp':'28 Feb 2015 00:00:00 GMT', 
      'val':'v3' 
     } 
     ] 
    }; 
}); 
    </script> 
</html> 

ответ

3

Вот специальный фильтр, который обертывает moment().format()

angular.module('myApp', []) 
 
.controller('myCtrl', function($scope) { 
 
    $scope.myDate = '28 Feb 2015 00:00:00 GMT'; 
 
}) 
 
.filter('format', function() { 
 
    return function(input, format) { 
 
    return moment(new Date(input)).format(format); 
 
    }; 
 
}) 
 
;
<script src="https://cdnjs.cloudflare.com/ajax/libs/moment.js/2.9.0/moment.min.js"></script> 
 
<script src="//ajax.googleapis.com/ajax/libs/angularjs/1.3.2/angular.min.js"></script> 
 

 
<div ng-app="myApp" ng-controller="myCtrl"> 
 
    <p>{{myDate | format:'ddd'}}</p> 
 
</div>

Вы также можете просто использовать угловые встроенные в date фильтр для этого, но это не нравится ваш формат даты, так что вам придется применить другой фильтр, чтобы преобразовать его в строку ISO первой , Если вам не нужны импульсы по какой-либо другой причине, я бы избавился от нее и просто сделаю это.

angular.module('myApp', []) 
 
.controller('myCtrl', function($scope) { 
 
    $scope.myDate = '28 Feb 2015 00:00:00 GMT'; 
 
}) 
 
.filter('dateToISO', function() { 
 
    return function(input) { 
 
    return new Date(input).toISOString(); 
 
    }; 
 
}) 
 
;
<script src="//ajax.googleapis.com/ajax/libs/angularjs/1.3.2/angular.min.js"></script> 
 

 
<div ng-app="myApp" ng-controller="myCtrl"> 
 
    <p>{{myDate | dateToISO | date:'EEE'}}</p> 
 
</div>

1

Просто добавьте вспомогательную функцию в области, которая форматирует прилагаемую дату как день.

angular.module('test', []).controller('test', function($scope) { 
    $scope.data = { 
    'key': [{ 
     'timestamp': '26 Feb 2015 00:00:00 GMT', 
     'val': 'v1' 
    }, { 
     'timestamp': '27 Feb 2015 00:00:00 GMT', 
     'val': 'v2' 
    }, { 
     'timestamp': '28 Feb 2015 00:00:00 GMT', 
     'val': 'v3' 
    }] 
    }; 

    $scope.toDay = function(date) { 
    return moment(date).format('ddd'); 
    }; 
}); 

И в вашем шаблоне уберите помощника и передайте дату в качестве аргумента.

<td>{{ toDay(tsval.timestamp) }}</td> 

Это делает:

day value 
Wed v1 
Thu v2 
Fri v3 

Вот plunker

+0

ОП спросил, как он может изменить его в HTML. Он хотел избежать этого. Кроме того, в любом случае это имеет большее значение как фильтр, отмеченный тем фактом, что у Angular есть фильтры даты. momentjs просто предлагает больше в этом отношении. – m59

+0

Я думаю, что вы неправильно поняли ... ОП спросил, как отформатировать дату с тремя символами в HTML и скрипте. Это достигает этого и позволяет избежать его озабоченности «создать новую строку json внутри скрипта». Хотя фильтр имеет смысл, а OP хочет использовать тот момент, который это делает, и он работает отлично. – Seth

+0

'call the momentjs format() метод внутри html' звучит как фильтр для меня, но все в порядке. Просто хотел дать тебе голову на случай. – m59

Смежные вопросы