在AngularJS服务中只调用一次或缓存$http get中的数据

我有一个简单的应用程序在DNN。下面是我的代码。 我想做的是创建一个只调用一次GETAPI的服务。因此，当来自输入的相同数据被调用两次时，服务将调用相同的api。我在inspect元素中使用network来查找调用函数

<script type="text/javascript">
    'use strict';

    var myApp<%=ModuleId%> = {};
    var isDlgOpen;

    try {
        myApp<%=ModuleId%> = angular.module('myApp<%=ModuleId%>', ['ngMaterial', 'ngMessages']);
    }
    catch (e) {
        myApp<%=ModuleId%> = angular.module('myApp<%=ModuleId%>', ['ngMaterial', 'ngMessages']);
    }

    //Service
    myApp<%=ModuleId%>.service('myService', ['$http', '$q', function ($q, $http) {
        this.data;
        var self = this;
        this.submit = function () {
        if (angular.isDefined(self.data)) {
            return $q.when(self.data)
        }
        return $http.get($scope.apiGetUrl).then(function (response) {
            self.data = response;
        })
    }
}]);

//Controller
myApp<%=ModuleId%>.controller('myCtrlr<%=ModuleId%>', function (myService, $scope, $http, $mdDialog) {
    $scope.submit = function (ev) {
    $scope.portalAlias = 'http://<%=PortalSettings.PortalAlias.HTTPAlias %>';
    $scope.apiGetUrl = $scope.portalAlias + '/desktopmodules/ORSIModule/api/RepairStatus/getRepair?JobNo=' + $scope.jobNo + '&SerialNo=' + $scope.serialNo;
    //form is valid

    if ($scope.myForm.$valid) {
        $scope.isLoading = true;
        return $http.get($scope.apiGetUrl).then(
            function (response) {
                if (response.data) {
                    $scope.myForm.$setSubmitted();
                    $mdDialog.show(
                        $mdDialog.alert()
                        .parent(angular.element(document.querySelector('dnnModule<%=ModuleId%>')))
                        .clickOutsideToClose(true)
                        .title('title: ' + response.data.status)
                        .textContent('Thank you.')
                        .ariaLabel('Status Alert Dialog')
                        .ok('Close')
                        .targetEvent(ev)
                        .hasBackdrop(false)
                    );
                } else {
                    alert("Not found.");
                }
            });
        }
    };
});

// Bootstrap the module
var appDiv = document.getElementById("dnnModule<%=ModuleId%>");
angular.bootstrap(appDiv, ["myApp<%=ModuleId%>"]);

"严格使用",；
var myApp={}；
var是开放的；
试一试{
myApp=angular.module（'myApp'，['ngMaterial'，'ngMessages']）；
}
捕获（e）{
myApp=angular.module（'myApp'，['ngMaterial'，'ngMessages']）；
}
//服务
myApp.service（'myService'，['$http'，'$q'，函数（$q，$http）{
这是数据；
var self=这个；
this.submit=函数（）{
if（角度定义（自数据））{
返回$q.when（自我数据）
}
返回$http.get（$scope.apiGetUrl）.then（函数（响应）{
self.data=响应；
})
}
}]);
//控制器
控制器（'myCtrlr'，函数（myService，$scope，$http，$mdDialog）{
$scope.submit=功能（ev）{
$scope.portalAlias='http://'；
$scope.apiGetUrl=$scope.portalAlias+'/desktopmodules/ORSIModule/api/RepairStatus/getRepair？JobNo='+$scope.JobNo+'&SerialNo='+$scope.SerialNo；
//表格有效
如果（$scope.myForm.$valid）{
$scope.isLoading=true；
返回$http.get（$scope.apiGetUrl）(
功能（响应）{
if（response.data）{
$scope.myForm.$setSubmitted（）；
$mdDialog.show(
$mdDialog.alert（）
.parent（angular.element（document.querySelector（'dnnModule'））
.单击外侧以关闭（真）
.title（'title:'+response.data.status）
.textContent（'谢谢'）
.ariaLabel（“状态警报对话框”）
.ok（‘关闭’）
.目标事件（ev）
.hasbackup（假）
);
}否则{
警报（“未找到”）；
}
});
}
};
});
//引导模块
var appDiv=document.getElementById（“dnnModule”）；
引导（appDiv，[“myApp”]）；

---

请有人帮帮我谢谢

您只需要在get请求中将缓存属性设置为true：

$http.get(url, { cache: true}).success(...);

您还可以使用：

$http({ cache: true, url: url, method: 'GET'}).success(...);

另一种方法是使用cachefactory服务：

var cache = $cacheFactory('myCache');

var data = cache.get(someKey);

if (!data) {
   $http.get(url).success(function(result) {
      data = result;
      cache.put(someKey, data);
   });
}

---

如果需要，还可以通过在模块配置函数中设置

$httpProvider.defaults.cache=true

，在启动时全局设置此选项。