javascript - 在 ng-repeat 循环中隐藏单个 div

Question

我有一个 ng-repeat 循环，它显示单独的面板（每个循环迭代一个）。在每个面板中，我都有一个带有 ng-click 事件的“标记为已读”按钮。我希望能够隐藏单击标记为已读按钮的面板，但到目前为止，我只能显示和隐藏所有面板，而不是单个选定的面板。如何让 ng-click 隐藏选定的面板？

谢谢

抱歉，这是我现在正在做的一些代码：

面板部分：

<section class="card" ng-repeat="item in notifications" ng-hide="msgRead">
        <div class="item item-header notification wrap">
            <h2>{{item.title}}</h2>
            <div class="notification-content">
                {{item.text}}
            </div>
            <button class="button button-block button-stable" ng-click="markAsRead(item.id)">
                Mark As Read
            </button>
        </div>
    </section>

这是我的控制器功能：

$scope.msgRead = true;

$scope.markAsRead = function (id) {

    $scope.msgRead = $scope.msgRead === false ? true : false;
};

斯蒂芬

Answer 1

你可以这样写：

<section class="card" ng-repeat="item in notifications" ng-hide="item.readonly">
    <div class="item item-header notification wrap">
        <h2>{{item.title}}</h2>
        <div class="notification-content">
            {{item.text}}
        </div>
        <button class="button button-block button-stable" ng-click="item.readonly = true">
            Mark As Read
        </button>
    </div>
</section>

您不需要为此编写范围方法。