2016-12-27 4 views
0

$urlMatcherFactory 공급자를 사용하여 새 매개 변수 형식을 만들 때 인코딩/디코딩 또는 유효성 검사 중에 형식을 필터링 할 수있는 방법이 있습니까? 필자는 "날짜"매개 변수가 필요하며 내장 된 "날짜"유형은 원하는 날짜 형식을 사용하지 않으므로 URL에서 인코딩/디코딩 할 수있는 사용자 정의 유형을 만드는 것이 가장 쉬운 방법입니다. config 블록에서이 작업을 수행해야합니다. 실제로 상태를 정의하기 전에해야합니다. 즉, 나는 공급자를 사용할 수 있음을 의미합니다 (내가 아는 한, 내가 잘못하면 나를 바로 잡으십시오). 매개 변수 필터링

나는 $get과 서비스를 검색 한 후 uibDateParserProvider 제공자를 주입하여, 날짜를 디코딩하기위한 각도 부트 스트랩에서 날짜 파서 서비스를 사용하는 방법을 발견,하지만이 갈 수있는 가장 좋은 방법은 아닌 것 같아. 또한 $filterProvider.$get은 2 번째 요소로 주입 함수 또는 그와 유사한 배열을 반환하기 때문에 $filter 공급자가 같은 방식으로 작동하지 않는 것처럼 보입니다. 이 주입 기능은 $filter 서비스가 아닙니다. 나는 그것이 실제로 무엇인지 알아낼 수 있기 위해 충분한 소스를 angular에 깊이 파고 들지 않았지만 알아내는 데 매우 흥미가있었습니다. 나는 나 자신으로 날짜를 파싱 할 수 있다는 것을 알고 있지만 왜 그렇게 많은 도움이 될 때 angular 서비스가 나를 위해 그것을 할 수 있습니까? 여기

은 내가 뭘하려고 오전의 예입니다 (ES6 사용) : 각 UI 라우터에 대한 매개 변수 유형을 만들 때 서비스를 사용할 수있는 방법이

angular.module('myModule').config(myStates); 

function myStates($filterProvider, $urlMatcherFactoryProvider, $stateProvider, uibDateParserProvider) { 
    const decodeDateFormat = 'yyyy-MM-dd'; // the decoder date format 
    const encodeDateFormat = 'MMM dd, yyyy'; // the encoder format, which is different from the decoder format 

    $urlMatcherFactoryProvider.type('mydate', { 
     // encode when switching states, e.g. `$state.go()` 
     encode: item => { 
      const $filter = $filterProvider.$get(); // returns an array like: ['$filter', filterService] (not sure what the 2nd element is) 
      $filter('date')(item, decodeDateFormat); // this is what I ultimately want to do 
     }, 
     // decode from the URL so we can use it as a date 
     // this uses a different format from the encoder date format 
     decode: item => { 
      const uibDateParser = uibDateParserProvider.$get(); // returns the uibDateParser service 
      return uibDateParser.parse(item, encodeDateFormat); 
     }, 
     // validate 
     is: item => { 
      return item == null || angular.isDate(item); // just need to know if it is a date 
     }, 
    }); 

    $stateProvider.state('myState', { 
     url: 'my-path?{someParam:mydate}', 
     someParam: null, 
    }); 
} 

있습니까? 그렇지 않으면 필터링을 수행 할 수 있도록 해당 공급자에서 $filter 서비스를 어떻게받을 수 있습니까?

답변

2

$injectorProvider 예 : $injectorProvider.$get().get('$filter');과 같이 $filter 서비스를 사용할 수 있습니다.

다음 스 니펫은 구성 단계에서 사용되는 예입니다.

angular.module('myApp', []) 
 
    .config(function($injectorProvider) { 
 
    var $filter = $injectorProvider.$get().get('$filter'); 
 
    console.log($filter('date')(new Date(), 'yyyy-MM-dd')); 
 
    }); 
 
angular.element(function() { 
 
    angular.bootstrap(document, ['myApp']); 
 
});
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.6.0/angular.js"></script>

+0

감사합니다. 간단하게 서비스를받는 것은 엄청나게 복잡합니다. – trysis

+0

@trysis 물론 복잡합니다. 18 세가되기 전에 맥주를 마시는 것 같아요.하지만 진지하게 설정 단계에서 angulajs가 모든 것을 보장 할 수는 없으므로 인젝터를 사용해야합니다. 모듈이로드되어이 단계에서 가지고있는 유일한 것은 공장입니다. 또한'$ filter' 서비스는 특별한 경우입니다. 왜냐하면 필터가'$ filterProvider'에 등록되어 있어야하기 때문입니다. –

+0

당신이 무엇을 말하려고하는지 모르겠지만 시도하지 않았을 것입니다 18시 이전에 맥주를 마시거나 심지어 21 세가되었습니다. 나는 이것이 해결하려고하는 상황에 대한 매우 복잡한 해결책 인 것처럼 말하려고했습니다. 나는 그것이 전반적으로 복잡한지 여부는 중요하지 않다고 생각한다. – trysis