Question

这是我的代码：

<body ng-app="intranet_App" ng-controller="myCtrl">
    <div class="container">
        <div class="modal" id="deleteProject">
            <div class="modal-dialog">
                <div class="modal-content">
                    <div class="modal-body" id="confirmMessage">
                    Are you sure do you want to delete this project??
                    </div>
                    <div class="modal-footer">
                        <button type="button" class="btn btn-default" id="confirmOk" ng-click="deleteProject(x.Id)">Ok</button>
                        <button type="button" class="btn btn-default" id="confirmCancel" data-dismiss="modal">Cancel</button>
                    </div>
                </div>
            </div>
        </div>  
            <div class="col-xs-12 margin20 padding table-responsive">
                <table class="col-xs-12 table table-hover table-bordered" id="projectList">
                    <thead class="colorBlue">
                        <tr><th>Project Name</th><th>Client</th><th>Client Co-ordinator</th><th>Action</th></tr>
                    </thead>
                    <tbody id="projectListTBody" >
                        <tr ng-repeat="x in projectList | filter:ProjectName">
                            <td>{{ x.ProjectName}}</td>
                            <td>{{ x.Client}}</td>
                            <td>{{ x.OnsiteCoordinator}}</td>
                            <td>
                                <i class="fa fa-user-plus fa-2x" ng-click="addResource()"></i>
                                <i class="fa fa-edit fa-2x" ng-click="editProj(x.Id)"></i>
                                <i class="fa fa-trash fa-2x" data-toggle="modal" data-target="#deleteProject"></i>
                            </td>
                        </tr>
                    </tbody>
                </table>
            </div>  
    </div>
</body>

<script>
    var app = angular
                    .module("intranet_App", [])
                    .controller("myCtrl", function ($scope, $http) {
                        $scope.projDetails = [];

                        $http.post('/Project/getProjectsList')
                            .then(function (response) {
                                console.log(response)
                                $scope.projectList = response.data;
                            })
                        $scope.deleteProject = function (id) {
                            alert(id)
                        }

                    });
</script>

当我单击表格中的delete图标时，我正在显示一个引导程序弹出窗口模式。在该模态中，我需要在x.Id方法内点击deleteProject on { {1}}按钮。但是我无法点击该方法，如何传递它？

Answer 1

在HTML代码中，添加ng-click以删除按钮

<i class="fa fa-trash fa-2x" data-toggle="modal" data-target="#deleteProject" ng-click="delete(x.id)"></i>

在控制器中添加以下方法

$scope.delete = function (id) {
    $scope.deleteId = id;
}

在deleteProject方法中使用它

$scope.deleteProject = function () {
    //use $scope.deleteId here
    alert($scope.deleteId);   
}

Answer 2

您尝试访问x之外的ng-repeat var，因此很自然地，它不知道x是什么。这就是您获得undefined的原因。

这是我能提出的最快的解决方案，但应该有更好的方法：

<i class="fa fa-trash fa-2x"
   data-toggle="modal"
   data-target="#deleteProject"
   ng-click="current = x"></i>

将最后点击的x分配到current。然后，您应该参考模态中的current：

<button type="button"
        class="btn btn-default"
        id="confirmOk"
        ng-click="deleteProject(current.Id)">
  Ok
</button>

将表数据传递到角度方法中

2 个答案: