Question

我目前有2个页面，page1.php和page2.php，每个页面都使用一个控制器来完成自己的功能等。但是，页面中的选项卡与promise内的工厂获得module完全相同。除了查询不同的ID之外，列表完全相同。例如，两个控制器都有：

pageListFactory.getData().then(function (result) {
    $scope.BasicItems = result; $scope.basicItemsList = [];
    angular.forEach($scope.BasicItems, function (BasicItem) {
        angular.forEach(BasicItem['SomeInnerArray'], function (BasicSomeInnerItem) {
             if (BasicSomeInnerItem == VARIABLE_THAT_CHANGES) {
                 $scope.basicItemsList.push({
                     ID: BasicItem.ID, Title: BasicItem.Title 
                 });
             }
         });
     });
});

因此使用了此代码，而VARIABLE_THAT_CHANGES每次都会发生变化。然而，正如我所说它在多个页面上使用，有没有办法只创建一个函数调用，然后每个页面只能调用一个特定的位并用它发送变量？

我尝试使用$rootScope，但当然这只是堵塞和减速，而且我不能完全使用$rootScope来传递$scope.basicItemsList，因为列表可以变得很大。

那么有没有办法重用这些代码而不只是将其复制并粘贴到每个控制器中？

Answer 1

当然可以重复使用它...
将工厂转换为服务，它基本上是名称更改，创建一个本地变量来存储数据，在第一次调用时更新数据，然后在第二次调用时获取数据。

.service('myService', ... stuff ... { // I suggest using a service, as I don't know if a factory would act as a singleton
    var myData = null;

    return {
        getData: function(){
            if(myData != null)
               return myData; // returns data
            else {
               return $http()... // ajax call returns promise
            }
        },
        setData: function(dataToSet){
            myData = dataToSet;
        }
    }

然后你的控制器：

//controller 1
var promiseOrData = pageListFactory.getData();
if(promiseOrData instanceOf Array){ // or whatever data you expect
    $scope.BasicItems = promiseOrData;
    ....
} 
else { // should be a promise
    promiseOrData.then(function (result) {
        pageListFactory.setData(result); // set the data once you get it.
        $scope.BasicItems = result; $scope.basicItemsList = [];
         ....

     }
}

在控制器2中，您只需要获取数据，因为返回的数据将是一个数组，而不是一个承诺

除此之外，编写一个指令，当你传递数据时将处理数据，然后你可以传递variableThatChanges并让指令处理它。

Answer 2

使用services并在该服务中编写函数并将变量VARIABLE_THAT_CHANGES传递给它。通过这种方式，您可以重用代码。

在多个页面上重用阵列集合

2 个答案: