0

我正在尝试在 ng-repeat （一个简单的表格）上显示/隐藏按钮。删除按钮替换为一致按钮。

这是我的代码

..... Angular stuff .....

function ContactsCtrl($scope, $http) {
    $scope.order = '-id';
    $scope.currentPage = 0;
    $scope.pageSize = 15;
    $http.get('/events/<%= @event.id -%>/contacts.json').success(function(data) {
        $scope.contacts = data;
        $scope.numberOfPages=function(){
            return Math.ceil($scope.contacts.length/$scope.pageSize);
        }
    });

    $scope.clickDelete = function(e,t) {
        console.log("delete");
            // rest api stuff...
        $scope.contacts.splice(e, 1); // This WORKS!
    };
    $scope.showDelete = function(e,t) {
        e.showDeleteButton = true; // This DOES NOT
    };
}

在 HTML 中：

 <tr ng-repeat="contact in contacts | filter:search | orderBy:order |      startFrom:currentPage*pageSize | limitTo:pageSize">
<td><a href="/contacts/{{contact.id}}/edit">{{contact.email}}</a></td>

                        ...
<td><a href="#" ng-click="showDelete(contact)" class="btn btn-small">delete</a>
<a href="/contacts/{{contact.id}}" ng-show="showDeleteButton" ng-click="clickDelete(contact)" class="btn btn-small btn-danger">confirm</a>
    </td>
</tr>
4

3 回答 3

1

您似乎没有从 showDelete 函数返回值。看起来 JSON 对象“showDeleteButton”上有一个属性，您可以直接绑定到该属性。

plnkr 示例：http: //plnkr.co/edit/eZTFyw9tGeWEfYw0U0I8

于 2013-03-14T16:29:17.537 回答
0

似乎您要做的是让删除按钮设置一个标志，该标志将显示确认按钮，该按钮将实际执行删除，对吗？ ng-repeat为每个元素创建一个新的子范围，因此您可以在子范围上设置一个“可确认”标志并使用它（小提琴）：

<a ng-click="confirmable = true">delete</a>
<a ng-show="confirmable" ng-click="clickDelete(contact)">confirm</a>
<a ng-show="confirmable" ng-click="confirmable = false">cancel</a>

此外，您似乎正在将contact对象传递给您的clickDelete函数并将其用作数组的索引，所以我不知道为什么会这样。小提琴用于indexOf查找要删除的索引。

于 2014-05-23T16:15:05.900 回答
0

我是这样做的：

JavaScript：

$scope.clickDelete = function(contact,i) {/* ... */ $scope.contacts.splice(i, 1);};
$scope.clickShowConfirm = function(contact) {contact.showdelete = true;};
$scope.clickCancel = function(contact) {contact.showdelete = false;}
$scope.showOrHide = function(contact) {return contact.showdelete;};

HTML：

<a href="#" ng-click="clickShowConfirm(contact)" ng-hide="showOrHide(contact)" class="btn btn-small">delete</a>
<a href="/contacts/{{contact.id}}" ng-click="clickDelete(contact,$index)" class="btn btn-small btn-danger" ng-show="showOrHide(contact)">ok</a>
<a href="#" ng-show="showOrHide(contact)" ng-click="clickCancel(contact)" class="btn btn-small">cancel</a>
于 2013-03-15T12:35:56.003 回答