【问题标题】:How to call php file via factory/service method using Angular.js如何使用 Angular.js 通过工厂/服务方法调用 php 文件
【发布时间】:2018-01-19 06:45:31
【问题描述】:

我需要使用 Angular.js 使用服务/工厂方法调用 php file。这里不是在每个文件中重复调用$http 来调用不同的php文件用于不同的目的,我需要使其通用。我在下面解释一个例子。

登录控制器.js:

var loginAdmin=angular.module('Takeme');
loginAdmin.controller('loginController',function($scope,$http,$location,$window,inputField){
   $http({
        method: 'POST',
        url: "php/Login/verify.php",
        data: userData,
        headers: { 'Content-Type': 'application/x-www-form-urlencoded' }
    }).then(function successCallback(response){
    },function errorCallback(response) {
    });
}

我有一个通用的route.js 文件,它对所有控制器都是通用的,如下所示。

route.js:

var Admin=angular.module('Takeme',['ui.router', '720kb.datepicker','ngMessages','ngCapsLock','ui.bootstrap','ngFileUpload','angularUtils.directives.dirPagination']);
Admin.run(function($rootScope, $state) {
    $rootScope.$state = $state;
});
Admin.config(function($stateProvider, $urlRouterProvider) {
    $urlRouterProvider.otherwise('/');
    $stateProvider
    .state('/',{
        url: '/',
        templateUrl: 'view/login.html',
        controller: 'loginController'
    })
})
Admin.factory('inputField',function($timeout,$window){
    return{
        borderColor:function(id){
             $timeout(function() {
                 var element = $window.document.getElementById(id);
                 if(element){
                      element.focus();
                      element.style.borderColor = "red";
                 }
             });
        },
        clearBorderColor:function(id){
            $timeout(function() {
                var element = $window.document.getElementById(id);
                 if(element){
                     element.style.borderColor = "#cccccc";
                 }
            });
        }
    };
});

这里我需要 $http service 来调用通用的 php 文件,在每个控制器中我都会重复调用 $http。我只需要传递$http service 的参数并返回响应。

【问题讨论】:

  • 为什么需要反复调用php?
  • 因为每次针对不同的数据库操作我都需要调用它。
  • 虽然最好从不同的角度控制器进行调用以保持代码的模块化和可维护性,但您也可以让 php 在内部执行不同的操作并返回最终响应,但这又很难维护和扩展。
  • @MayankSinghal :那么对于这种情况应该有什么更好的解决方案。
  • 如果我是对的,你登录后会有不同的视图和功能吗?

标签: javascript php angularjs


【解决方案1】:

创建工厂/服务

angular.module('myApp').factory('DataService', DataService);

DataService.$inject = ['$http', '$q'];
function DataService($http, $q) {
return {
    getData: getData,
}
function getData(userData) {
    var deferred = $q.defer();
    $http({
        method: 'POST',
        url: "php/Login/verify.php",
        data: userData,
        headers: {
            'Content-Type': 'application/x-www-form-urlencoded'
        }
    }).then(function(response) {
            deferred.resolve(response.data);
        },
        function(error) {
            deferred.reject(error.data);
        });
    return deferred.promise;
};
}

然后在需要时在控制器中使用这个工厂

angular.module('myApp')
.controller('MyController', ['$scope', 'DataService',  
function($scope, DataService ) {

    $scope.getMyData = function() {
        var data = {};
         DataService.getData(data)
            .then(function(response) {

            }, function(error) {

            });
    };

}
]);

【讨论】:

  • 我会测试这个并告诉你。
猜你喜欢
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 2016-11-11
相关资源
最近更新 更多