angularjs：$ interval调用在取消之后永远不会发生

Question

我有一个要求，只要我加载一个页面，它就会进行api调用  显示页面上的数据。并且每15秒后它会继续将数据加载到节目中，并且我有一个具有单击按钮功能的弹出窗口（ConfigModalButtonClick）。当我打开弹出窗口时，我想停止进行api调用的间隔，因此我在弹出窗口打开时添加了$ interval.cancel但是现在当我点击弹出窗口中的按钮时，api调用永远不会发生。我怎么能确保api调用发生它看起来我需要再次调用区间函数，但不知道在哪里？ 当我关闭弹出窗口时，间隔应该在15秒后正常运行。

    $scope.timeDelay = 15000;       
    $scope.loadData = function() {

         $http.post(url,data
         ).then(
             function(response) {

                 $scope.output = response.data;

             },
             function(response) {

                 $scope.retrieveErrorMssg = "Failed to retrieve required data. Try again.";
             });
    };

    var interval = $interval(function() {
        $scope.loadData();

    }, $scope.timeDelay);

    $scope.showConfigurationModal = function() {

         $interval.cancel(interval);
         $scope.state.settingModalVisible = true;
    };

    $scope.closeConfigurationModal = function() {

        $scope.state.settingModalVisible = false;
        // Need to explicitly trigger the dismiss function of the modal
        $scope.settingModalDismiss();
    };      

    $scope.ConfigModalButtonClick = function () {

         $scope.state.settingModalVisible = false;            
         //some data manipulation


         $scope.loadData();          

    };