加入收藏 | 设为首页 | 会员中心 | 我要投稿 李大同 (https://www.lidatong.com.cn/)- 科技、建站、经验、云计算、5G、大数据,站长网!
当前位置: 首页 > 综合聚焦 > 服务器 > 安全 > 正文

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的用法?

??$http是Angularjs内置的服务,用起来可以链式调用,用法如下:

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用法?

  • Service都是单例的
  • Service由$injector负责实例化
  • Service在整个应用的声明周期中存在,可以用来共享数据
  • 在需要使用的地方利用依赖注入机制注入Service
  • 自定义的Service需要写在内置Service后面
  • 内置Service的命名以$符号开头,自定义Service应该避免

我们创建02providerhtml:

 <div ng-controller="ServiceController"> <label for="">用户名</label> <input type="text" ng-model="username" placeholder="请输入用户名"> <pre ng-show="username">{{users}}</pre> </div>

引用的js代码如下,其中 timeoutAngular http,$interval,下面的userListService是我们自定义的服务,调用方法为:

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总结:
- compile? filter:数据格式化工具内置了8个
- interval? timeout
- local? location
- location? log
- parse? http :封装了ajax

github地址:ng中定义service和filter的方法

(编辑:李大同)

【声明】本站内容均来自网络,其相关言论仅代表作者个人观点,不代表本站立场。若无意侵犯到您的权利,请及时与联系站长删除相关内容!

    推荐文章
      热点阅读