如何重用模式作为确认对话框,以从AngularJS中删除控制器的动作?

时间:2019-07-31 03:37:15

标签: angularjs angularjs-directive bootstrap-modal angular-ui-bootstrap

我有一些控制器,它们两个都具有由ng-click触发的删除功能,当调用删除功能时,我将显示一个js确认对话框,以警告用户有关其所对象的信息要删除。

但是,现在,我想使用引导程序而不是js确认对话框来提醒用户,并且所有delete函数在被调用时都将使用相同的模式来发出警报,但是modal的内容将由调用的delete函数来更改。那我可以只用一种模态吗?

<div id="modal_alert_dialog" class="modal fade modalAlert" tabindex="-1" role="dialog" aria-hidden="false">
    <div class="modal-dialog">
        <div class="modal-content">
            <div class="modal-body">
                <span class="close" data-dismiss="modal" aria-label="Close">x</span>
                <h3 style="text-align:left;">Notice!</h3>
                <p class="text-left">Are you sure you want to delete {{object_name}}</p>// object_name variable is the name of object that user chosen to delete.
                <div class="text-right">
                    <button type="button" class="close btn" data-dismiss="modal" aria-label="Close">Cancel</button>
                    <button class="btn" ng-click="dynamicDeleteFunction">OK</button>//dynamicDeleteFunction is the fuction which user choose as a confirm "yes"
                </div>
            </div>
        </div>
    </div>
</div>
app.controller('userController', function ($scope){
  $scope.deleteUser = function () {
    $scope.object_name = "user 'ABC'";
    //Maybe a function or something trigger the modal show up
    if (confirmed){
      //execute delete....
    }
  }
});
app.controller('productController', function ($scope){
  $scope.deleteProduct = function () {
    $scope.object_name = "product 'ABC-111'";
    //Maybe a function or something trigger the modal show up
    if (confirmed){
      //execute delete....
    }
  }
});
app.controller('categoryController', function ($scope){
    $scope.object_name = "category 'CatI'";
    //Maybe a function or something trigger the modal show up
    if (confirmed){
      //execute delete....
    }
});

0 个答案:

没有答案