Question

我有一个angularJS app.controler，里面有一个数据表。在最后一列是一个删除按钮。如果我按下此按钮，则会出现一个模态对话框，其中包含一个问题“你真的想要删除这个用户吗？” 这工作正常。但是如何在模态对话框中显示用户名？以及如何将用户标识发送到后端控制器？如果我写这个 return '<a class="btn btn-danger btn-sm btn-block" href=/deleteUser?userid=' + data + '>' + ($filter('translate')('delete')) + '</a>'; 用户将立即删除。这是我的表： usertable

模态对话框： the modal dialog in action (without the username)

这是html中的一个片段

 <div id="myModal" class="modal">
   <div class="modal-content">
     <div class="modal-header">
       <h2>DELETE USER</h2>
     </div>
     <div class="modal-body">
   <p>Do you realy want to delete the user? </p>
   <p>username: ??? </p>
 </div>
 <div class="modal-footer">
   <button type="button" class="btn btn-default" data-dismiss="modal">CANCEL</button>
   <button type="button" class="btn btn-danger">DELETE</button>
 </div>
 </div>
 </div>

这是app.controller

app.controller('UsersController',['$translate', '$scope','$filter', '$http', function($translate,$scope, $filter, $http) {

                $scope.users = [];
                $http.get('/user').then(function(resp) {
                    $scope.users = resp.data;
                });

                $scope.tableConfig = {
                    columns : [
                            {
                                data : 'username'
                            },
                            {
                                data : 'lastname'
                            },
                            {
                                data : 'firstname'
                            },
                            {
                                data : 'supplier',
                                render : function(data, type, row, meta) {
                                    if (!data || !data.name) {
                                        return '';
                                    }
                                    return data.name;
                                }
                            },
                            {
                                data : 'role'
                            },
                            {
                                //the edit button
                                data : 'id',
                                render : function(data, type, row, meta) {
                                    if (!data || !data) {
                                        return '';
                                }
                                    return '<a class="btn btn-warning btn-sm btn-block" href=/editUser?userid=' + data + '>' + ($filter('translate')('edit')) + '</a>';
                                }

                            },
                            {
                                //the delete button
                                data : 'id',
                                render : function(data, type, row, meta) {
                                    if (!data || !data) {
                                        return '';
                                }
                                    return '<button type="button"  class="btn btn-danger btn-sm btn-block" id="myDELBtn"  data-toggle="modal" data-target="#myModal" >DEL</button>'

                                }
                            },

                    ]
                }


            }]);

Answer 1

通常，在控制器中的操作中，您传递实体的ID;一个很好的例子是你可以让你的HREF成为/ users / delete / 5，为用户＃5调用控制器动作删除。这样您就可以将ID传递给控制器，并使用AJAX调用从中检索用户名。

Answer 2

/**
         * @Function to delete a user.
         */                    
        $scope.deleteConfirmation = function(size) {

                 var modalInstance = $modal.open({
                        templateUrl : 'views/userManagement/gxDeleteMessagePopup.html',
                        controller : ModalInstanceCtrlForDelete,
                        size : size,
                        resolve : {
                            dataSelect : function() {
                                return $scope;
                            }
                        }
                    });
                 modalInstance.result.then(function(selectedItem) {
                    },function() {
                }); 
        };


        //Added controller for delete message modal pop up 
        var ModalInstanceCtrlForDelete = function($scope, $modalInstance,dataSelect) {
            $scope.dataSelect = dataSelect;
                $scope.ok = function() {    

                      Service.deleteUser(dataSelect.gridOptions.user);
                     $modalInstance.close();    
                     $state.go('home.Manage Users');
                };

                $scope.cancel = function() {
                    $modalInstance.dismiss('cancel');

                };
                };

如何在数据表

2 个答案: