각도 ui-sref, 날짜 입력 형식을 지정할 수 없습니다.

Question

날짜가있는 GET URL을 추가하려하지만 "yyyyMMdd00"형식이어야합니다.

AngularJS - convert dates in controller

및

Binding value to input in Angular JS

내가 중간 스타일의 형식으로 날짜를 생성 만 할 수 있습니다 :

여기에 모든 솔루션을 시도에도 불구하고 dateFrom % 3DFri + 2월 + 24 + 2017 + 00 % 3A00 % 3A00 + GMT % 252B0000 + % 28GMT + 표준 + 시간 % 29

또는 아무 것도 표시되지 않습니다.

 <ion-content class="item-input"> 
<label class="item-input"> 
    <span class="input-label">Date From</span> 
    <input type="date" ng-model="dateFrom"> 
</label> 
<h3>{{dateFrom | date: "yyyyMMdd00"}}</h3> 

<a ui-sref="date({dateFrom:dateFrom})">Go</a> 
</ion-content> 

컨트롤러에게

 .controller("DateCtrl", function ($scope, $stateParams, dateService) { 
$scope.events = dateService.getEvents($stateParams.dateFrom).then(function (events) { 
    $scope.events = events; 

}); 

공장 :

 .factory('dateService', function ($http) { 
    var events = []; 

    return { 
     getEvents: function (date) { 
      var params = { 
       dateFrom: date 
      } 

      return $http.get('URL', { params: params }).then(function (response) { 
       events = response.data.events; 
       return response.data.events; 
      }); 

을 마지막으로 라우팅 :

HTML합니다 (H3는 내 URL에 추가 할 것을 생산)

.state('date', { 
    url: "/date/:dateFrom", 
    templateUrl: "templates/Date.html", 
    controller: "DateCtrl" 
}) 

.state('date', { 
    url: "/date/{dateFrom:dateType}", // Use type "dateType" here 
    templateUrl: "templates/Date.html", 
    controller: "DateCtrl" 
}) 

는 경로 파일이 포함 : 유형을 사용 17,451,515,

Answer 1

사용 $urlMatcherFactoryProvider.type

, 당신은 컨트롤러 등

업데이트 상태 선언에 조금 디코딩 된 개체에 액세스 할 수 있습니다 :

$urlMatcherFactoryProvider.type('dateType', { 
    encode: function(date) { 
    // Convert date object to URL format 
    var format = 'yyyyMMdd00'; 
    return $filter('date')(date, format); 
    }, 
    decode: function(dateStr) { 
    // Convert URL date to date object 
    var year = parseInt(dateStr.slice(0, 4)); 
    var month = parseInt(dateStr.slice(4, 6)); 
    var day = parseInt(dateStr.slice(6, 8)); 
    var date = new Date(year, month, day) 
    return date; 
    }, 
    is: function(item) { 
    return true; 
    } 
}); 

또한프로젝트에 이미 포함되어있는 경우 날짜를 직렬화 및 비 직렬화하는 데을 사용합니다.