Làm cách nào để sử dụng bộ lọc ngày trong mô hình ng?

Question

Điều này có vẻ như nó nên được đơn giản nhưng nó đã eluded tôi. Tôi muốn chuyển đổi chuỗi ngày của mình thành một đối tượng ngày tháng và lọc cách nó được hiển thị.

Tôi có một ứng dụng góc đơn giản và điều khiển

myApp.controller('myAppCtrl', function($scope) { 
    $scope.MyDate = Date("2014-09-23T15:26:49.1513672Z"); 
}) 

Tôi có JSON trở về từ máy chủ và ngày Tôi làm việc với là một chuỗi theo định dạng trên

từ tài liệu góc khoảng date filters

<span>{{1288323623006 | date:'medium'}}</span><br> 

công trình này và đặt ra là: 28 Tháng Mười 2010 20:40:23

Khi tôi cố gắng sử dụng bộ lọc trên $ scope.MyDate như sau:

{{MyDate | date:'medium'}} 

ngày chưa được định dạng nhưng trông như thế này: Wed 24 Tháng Chín 2014 07:40:02 GMT-0700 (Thái Bình Dương Daylight Time)

Cuối cùng, tôi muốn để ràng buộc một hộp văn bản đầu vào cho giá trị này và lọc nó như thế này:

<input type="text" class="form-control" ng-model="MyDatee | date:'medium'"/> 

tôi hy vọng một lần tôi nhận được phiên bản đơn giản làm việc tôi có thể nhận pr thực tế của tôi oblem được giải quyết với đầu vào văn bản.

Đây là một plunker with the above code

Answer 1

Đối với phần đầu tiên, sử dụng new Date() thay vì:

$scope.MyDate = new Date("2014-09-23T15:26:49.1513672Z"); 

Thứ hai, bạn có thể tạo ra một chỉ thị để định dạng mô hình trong input (sửa đổi từ here)

Đánh dấu là:

<input type="text" class="form-control" ng-model="MyDate" formatted-date format="medium" /> 

Và chỉ thị giống như:

angular.module('myApp').directive('formattedDate', function(dateFilter) { 
    return { 
    require: 'ngModel', 
    scope: { 
     format: "=" 
    }, 
    link: function(scope, element, attrs, ngModelController) { 
     ngModelController.$parsers.push(function(data) { 
     //convert data from view format to model format 
     return dateFilter(data, scope.format); //converted 
     }); 

     ngModelController.$formatters.push(function(data) { 
     //convert data from model format to view format 
     return dateFilter(data, scope.format); //converted 
     }); 
    } 
    } 
}); 

Xem cập nhật plunkr

Answer 2

http://plnkr.co/edit/6Se6Cv6ozF0B7F0X6gjl?p=preview

nhưng bạn không thể sử dụng bộ lọc bên trong đầu vào ngày formate bên nhập xin vui lòng xem tại đây

Using angularjs filter in input element

$scope.MyDate = new Date("2014-09-23T15:26:49.1513672Z"); 

Answer 3

trong $ scope.MyDate bạn hãy thay thế nó với

$scope.MyDate = new Date("2014-09-23T15:26:49.1513672Z"); 

Answer 4

tôi chỉ làm bạn chương trình mới một ngày, bạn có thể sử dụng một bộ lọc về giá trị.

Answer 5

Bạn có thể thay đổi định dạng ngày tháng như thế này

<input type="text" class="form-control" value="{{MyDatee | date:'medium'}}"/>