AngularJS 커스텀 서비스와 필터의 혼합 사용

Angular에서는 데이터 형식을 지정하는 데 필터를 사용합니다. 예를 들어 프로젝트에서는 배경에서 가져온 데이터가 직접 표시되어 사용자가 그 의미를 이해하지 못하는 경우가 많습니다. 인터페이스 측면에서 전통적인 J에서는 긴 코드 목록과 다양한 풍자가 필요하지만 Angular에서 제공하는 필터는 소개가 많이 필요합니다.

AngularJS 커스텀 서비스와 필터의 혼합 사용에 대한 소개는 다음과 같습니다.

1. 커스텀 서비스 "$swl" 생성

var app = angular.module('myApp', []);
app.service("$swl", function() {
this.after = function(data) {
return "("+data + " after,$swl";
};
this.before = function(data) {
return "($swl,before " + data+")";
}
})

2. 컨트롤러를 통해 커스텀 서비스 호출

html 코드

<div ng-app="myApp" ng-controller="myCtrl">
{{name }}
</div>

컨트롤러 코드

app.controller("myCtrl", function($scope, $swl,$timeout) {
$scope.name = $swl.before("swl");
$timeout(function(){
$scope.name = $swl.after("swl");
},2000)
})

3. fliter

html 코드

<div ng-app="myApp" ng-controller="myCtrl">
{{name | before}}
</div>

fliter 코드

app.filter("before",["$swl",function($swl){
return function(data){
return $swl.before("(filter,"+data+")");
}
}])