• angularjs 系列之$q和promise


    还是同一个项目,在项目中,发现多个controller之内有一个共同的服务器请求,当时只是不断的重复使用,如今,现在项目结束,代码开始走向了优化迭代的阶段;

    首先,我的思路是把这个共同的请求,从controller里抽出来,做成一个服务,然后在需要的controller里注入;

    第一个问题是请求服务器数据:

    var app = angular.module('testApp',['ui.bootstrap']);
    app.factory('myService',['$http','$q',function($http,$q){
        return {  
            query : function() {  
                var deferred = $q.defer(); // 声明延后执行,表示要去监控后面的执行  
                
                $http({method: 'GET', url: 'data.php'}).success(function(data, status, headers, config) {  
                
                    deferred.resolve(data);  // 声明执行成功,即http请求数据成功,可以返回数据了  
                    
                }).error(function(data, status, headers, config) {  
                
                    deferred.reject(data);   // 声明执行失败,即服务器返回错误  
                    
                });  
                
                return deferred.promise;   // 返回承诺,这里并不是最终数据,而是访问最终数据的API  
            }, // end query 
            title : '页面标题设置'
        };  
    }]);

    至于promise,这里我简单的说,他是一个对象,也是一种异步编程模式,要了解详细,请到这里js 异步编程

    服务创建之后,把服务创建到controller里,调用就可以跑起来了。

    app.controller('myController',function($scope,myService){
        var use = myService.query(); //调用服务里的query函数
        use.then(function(data){//then是回调函数,里面可以写user.then(successFun(),errFun());
            $scope.version = data;//data 是promise的返回数据
        });
        setTimeout(function(){
            console.log($scope.version);
        },1);
        
        var tit = myService.title;
        $scope.title = tit;
    });

    这个是使用factory创建的服务,创建服务还有其他方式:service()、provider()等;

    这个例子是关于服务里中包含服务器交互的一个方法,需要的小伙伴可以参考;

    注意:服务里不能注入$scope这个对象

  • 相关阅读:
    UICollectionView下拉使header放大模糊
    odoo13下searchpanel进行扩展.
    (原创)odoo关系字段在视图中的行为控制 总结
    (原创)odoo解决方案---接收以及回复外部邮件
    (原创)odoo11配置邮件功能的那些事儿
    入坑winpdb-1.4.8
    Python的hasattr() getattr() setattr() 函数使用方法详解
    jQuery webcam plugin
    (原创)odoo在docker环境下无法备份
    (转)PostgreSQL pg_dump&psql 数据的备份与恢复
  • 原文地址:https://www.cnblogs.com/wwlhome/p/5603146.html
Copyright © 2020-2023  润新知