Angularjs 如何在Angular中重用代码?

Angularjs 如何在Angular中重用代码?,angularjs,function,angular2-directives,angular-factory,Angularjs,Function,Angular2 Directives,Angular Factory,我有一个控制器,它获取一些数据并根据信息添加一些额外的项目。这些信息应该是可搜索的。我现在已经有了这方面的工作代码,但我想知道重用代码的最佳方法是什么?是指令吗?工厂代码如下: app.controller('searchProducts', function($scope, $http) { $scope.search = function(val) { $scope.val = val; //from here let query; if(!$scope.va

我有一个控制器,它获取一些数据并根据信息添加一些额外的项目。这些信息应该是可搜索的。我现在已经有了这方面的工作代码,但我想知道重用代码的最佳方法是什么?是指令吗?工厂代码如下:

app.controller('searchProducts', function($scope, $http) {
$scope.search = function(val) {
    $scope.val = val;
    //from here
    let query;
    if(!$scope.val) {
        query = BASE_URL+"Products";   
    }
    if($scope.val) {
        query = encodeURI("Products?$filter=contains(ProductName,\'"+val+"\')");
        query = BASE_URL+query;
    }
    $http.get(query)
        .then(function(response) {
            $scope.rawData = response.data;
            angular.forEach($scope.rawData.value, function(value) {
                //looping the data, replacing the IDs with actual data from the source
                //Getting actual Supplier using SupplierID
                $http.get("http://services.odata.org/V4/Northwind/Northwind.svc/Suppliers("+value.SupplierID+")/CompanyName/$value")
                    .then(function(response) {
                        value.Supplier = response.data;           
               })
                //Getting actual Category using CategoryID
                $http.get("http://services.odata.org/V4/Northwind/Northwind.svc/Categories("+value.CategoryID+")/CategoryName/$value")
                    .then(function(response) {
                        value.Category = response.data;           
               })
            });
        })
    //to here
}
    //is repeated here
});

您可以使用工厂并将该行为捆绑到一个或多个方法中,即

app.factory('myFactory', function($http, $q) {
    return {
        myRequest: function(query) {
            return $http.get(query).then(this.myHandler);
        },
        myHandler: function(response) {
            var categoryPromises = [];
            var supplierPromises = [];
            angular.forEach(response.data, function(value) {
                supplierPromises.push($http.get("http://services.odata.org/V4/Northwind/Northwind.svc/Suppliers("+value.SupplierID+")/CompanyName/$value"));
                categoryPromises.push($http.get("http://services.odata.org/V4/Northwind/Northwind.svc/Categories("+value.CategoryID+")/CategoryName/$value"));
            });
            return $q.all([$q.all(supplierPromises), $q.all(valuePromises)]);
        }
    };
});
// and to invoke the factory
app.controller('myController', function(myFactory) {
    myFactory.myRequest('/path/to/resource')
        .then(function(results) {
            //... handle your results
        })
        .catch(function(e) {
            throw e;
        });
});

为http调用创建一个服务或factory。我尝试创建一个服务,但在控制器中包含它时遇到一些问题。代码如下:如果您遵守$http承诺,它将工作得更好。