将参数传递给角

Question

我将创建一个控制器，该控制器将在数据库的选定表中列出不同的选定字段，并将其传递给我的API。

目前，我正在使用一个脏方法，它创建了几个控制器，其中有字段名和表名。

controller.js

.controller('ListDistinctCustomerCtrl', function($scope, $http) { 
    var xhr = $http({ 
    method: 'post', 
    url: 'http://localhost/api/list-distinct.php?table=customer&field=cust_code' 
    }); 
    xhr.success(function(data){ 
    $scope.data = data.data; 
    }); 
}) 

.controller('ListDistinctSupplierCtrl', function($scope, $http) { 
    var xhr = $http({ 
    method: 'post', 
    url: 'http://localhost/api/list-distinct.php?table=supplier&field=supp_code' 
    }); 
    xhr.success(function(data){ 
    $scope.data = data.data; 
    }); 
}) 

，这是API文件

列表distinct.php

<?php 
require_once '/config/dbconfig.php'; 
$table = $_GET['table']; 
$field = $_GET['field']; 
GetData($table,$field); 

function GetData($tablename,$fieldname) { 
    $sql = "SELECT distinct $fieldname as expr1 FROM $tablename order by expr1 asc"; 
    try { 
     $db = getdb(); 
     $stmt = $db->prepare($sql); 
     $stmt->execute(); 
     $data = $stmt->fetchAll(PDO::FETCH_OBJ); 
     $db = null; 
     echo json_encode(array('data' => $data)); 
    } catch(PDOException $e) { 
     echo '{"error":{"text":'. $e->getMessage() .'}}'; 
    } 
} 
?> 

我相信这是一个干净，更好的方式来做这个。

Answer 1

您可以创建一个包含访问您的API的方法的服务。这将使您能够减少您的控制器中的代码重复，并允许一般更干净的代码。

.service('APIService', function($http){ 
    var base = 'http://localhost/api/'; 
    this.listDistinct = function(table, field){ 
     return $http({ 
      method: 'post' 
      , url: base + '/list-distinct.php' 
      , params: { 
       table: table 
       , field: field 
      } 
     }); 
    } 
}); 

您的控制器会注入服务并调用访问api所需的任何方法。结果将通过附加承诺回调以相同的方式获得。

.controller('ListCtrl', function($scope, APIService){ 
    APIService.listDistinct('customer', 'cust_code').then(function(data){ 
     $scope.data = data; 
    }) 
}); 

对于PHP代码，您需要使用可能的表/字段名称的白名单以确保安全操作。没有这样的检查，你很容易受到SQL注入攻击。一个简单的数组检查就足够了。

$safeTables = ['customer', 'supplier']; 
$safeFields = ['cust_code', 'supp_code']; 

if (!in_array($tablename, $safeTables) || !in_array($fieldname, $safeFields)){ 
    throw new Exception('Invalid parameter'); 
} 

Answer 2

首先，如果你想的$ HTTP来传递参数有一个更清洁方法：

$http( 
    { 
     url: 'your url', 
     method: 'GET or POST', 
     params: { 
     // list of params 
     } 
    } 
); 

现在，是代码维护和可读性使用Service provider重要。 您可以使用Factory作为服务并创建API服务。

例子：

angular.module('yourModule').factory('ServiceAPI', [ '$http', function ($http) { 

var factory = {}; 

//PUBLIC METHODS 
factory.method = method; 

function method() { 
    return $http( 
      { 
       url: 'your url', 
       method: 'GET or POST', 
       params: { 
       // list of params 
       } 
      } 
     ); 
} 

return factory; 
} ]); 

现在你可以在与HTTP的承诺回复您的控制器和使用方法，功能注入ServiceAPI。

angular.module('your module').controller('Ctrl', [ '$scope', 'ServiceAPI' , 
function ($scope, ServiceAPI) { 

    ServiceAPI.method.then(function (data) { 
     $scope.data = data; 
    }, function(){console.err('error');}); 
} 
]); 

AngularJS方面，现在是清晰可读的。

我希望能对你有所帮助。 享受

Answer 3

其时间Angular Providers

这是你的情况的一个例子：

angular.module('starter') 
.factory('services', services); 

function services($http) { 
     var services = { 
      customer: customer, 
      supplier: supplier, 
     }; 
     return services; 

     //customer service 
     function customer() { 
      var req = { 
       method: 'POST', 
       url: 'http://localhost/api/list-distinct.php?table=customer&field=cust_code', 
       headers: { 
        'Accept' : 'application/json', 
        'contentType': "application/json" 
       } 
      }; 
      return $http(req); 
     }, 

     //supplier service 
     function supplier() { 
      var req = { 
       method: 'POST, 
       url: 'http://localhost/api/list-distinct.php?table=supplier&field=supp_code', 
       headers: { 
        'Accept' : 'application/json', 
        'contentType': "application/json" 
       } 
      }; 
      return $http(req); 
     }; 
} 

然后你从控制器内调用它们像这样：

services.customer().then(
     function(response) { 
     //do whatever is needed with the response 
     console.log(response); 
     }, 

     function (error) { 
     console.log(error); 
     } 
    ); 




services.supplier().then(
      function(response) { 
      //do whatever is needed with the response 
      console.log(response); 
      }, 

      function (error) { 
      console.log(error); 
      } 
     );