ng中定义service和filter的方法
发布时间:2020-12-17 09:05:52 所属栏目:安全 来源:网络整理
导读:angularjs子定义Service用法? $http的用法? ?? $http 是Angularjs内置的服务,用起来可以链式调用,用法如下: myMdoule.controller( 'LoadDataCtrl' ,[ '$scope' , '$http' , function ( $scope , $http ) { $http ({ method : 'get' ,url : 'js/data.jso
angularjs子定义Service用法?$http的用法??? myMdoule.controller('LoadDataCtrl',['$scope','$http',function($scope,$http){
$http({
method : 'get',url : 'js/data.json'
}).success(function(data,status,headers,config){
console.log('success.....');
console.log(data);
$scope.users = data;
}).error(function(data,config){
console.log('error');
})
}])
自定义service用法?
我们创建02providerhtml: <div ng-controller="ServiceController"> <label for="">用户名</label> <input type="text" ng-model="username" placeholder="请输入用户名"> <pre ng-show="username">{{users}}</pre> </div>
引用的js代码如下,其中
userListService.userList(newUserName).success(function(data,status){
$scope.users = data;
})
所有的代码: var myServiceApp = angular.module('myServiceApp',[]);
myServiceApp.factory('userListService',['$http',function($http){
var doRequest = function(username,path){
return $http({
method : 'get',url : 'js/data.json'
});
}
return {
userList : function(username){
return doRequest(username,'userList');
}
}
}]);
myServiceApp.controller('ServiceController','$timeout','userListService',$timeout,userListService){
var timeout;
$scope.$watch('username',function(newUserName){
if(newUserName){
if(timeout){
$timeout.cancel(timeout);
}
}
timeout = $timeout(function(){
userListService.userList(newUserName).success(function(data,status){
$scope.users = data;
})
},350);
})
}])
filter和自定义的filter?html内容如下: {{1304375948024 | date}} <br> {{1304385948024 | date:"MM/dd/yyyy @ h:mma"}} <br> {{1304375648024 | date:"yyyy-MM-dd hh:mm:ss"}} <br> 自定义filter:{{'大漠孤烟直' | filter1}}
03.filter.js自定义如下: var myModule = angular.module('myModule',[]);
myModule.filter('filter1',function(){
return function(item){
return item + '?王者?'
}
})
Service总结: github地址:ng中定义service和filter的方法 (编辑:李大同) 【声明】本站内容均来自网络,其相关言论仅代表作者个人观点,不代表本站立场。若无意侵犯到您的权利,请及时与联系站长删除相关内容! |