javascript - Angular UI 多个弹出窗口，提交后以编程方式关闭单个弹出窗口

Question

我正在尝试在提交完成后基于索引以编程方式关闭打开的弹出窗口。

页面上的html:

<a role="button" uib-popover-template="dynamicPopover.templateUrl" 
   popover-is-open="isPopoverOpen[$index]" ng-click="openPopover($index)>                 
open popover
</a>

弹出框模板:

<input ng-model="input.value">
<button class="btn" ng-click="saveValue()">submit</button>

Controller :

$scope.openPopover = openPopover;
$scope.saveValue = saveValue;

$scope.dynamicPopover = {
    templateUrl: 'templates/test_popup.html'
};

function openPopover(index){
    $scope.isPopoverOpen[index] = true;
    $scope.popIndex = index;
}

function saveValue(index){

    var data = {
        value: $scope.input.value
    }

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

           $scope.isPopoverOpen[$scope.popIndex] = false;

        }, function (err) {

        });

    }
}

除了在 ajax 完成时关闭弹出窗口之外，所有这些都有效，所以这甚至可能吗？

Answer 1

您可以保存索引并在您的 saveValue 函数中使用它

JS:

$scope.openPopover(index){
    $scope.isPopoverOpen[index] = true;
    $scope.selectedIndex = index;
}

 $scope.saveValue=function(){

        var data = {
            value: $scope.input.value
        }

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

               $scope.isPopoverOpen[$scope.selectedIndex ] = false;

            }, function (err) {

            });

        }
    }