javascript - Angular ng-show 多个条件(不超过 3 个工作)

Question

我有一个 div，我需要在 5 个条件中的任何一个为真时显示它。

问题 是 ng-show 似乎只考虑了前 3 个条件。我不知道这是否只是我的问题，因为我找不到任何相关问题。

在下面的示例中，我一直在移动条件，但每次只考虑前 3 个条件。任何条件落入第4位，不显示div。

如果您知道在不可能有​​超过 3 个条件的情况下的解决方法，请告诉我。

这个div很大，所以我只贴了一部分:

<div class="row " ng-show="selectedAllP[0] || selectedAllF[0] || selectedAllP || selectedAllD || level">
    <div class="row selectedCase">
        <div><h3 id="choices">Your choices:</h3></div>
        <div class="col-md-4" id="publisher">
            <h4>Publishers</h4>
            <div class="level" ng-hide="selectedAllP[0] || selectedAllP">Select publisher</div>
            <table class="table table-bordered table-striped">
                <tbody id="pub">
                    <tr ng-hide="selectedAllP.Name ===  '   - Any Publisher -'" ng-repeat="roll in selectedAllP" ng-click="deSelectP(roll)">
                        <td class="deselect">{{roll.Name}}</td>
                    </tr>
                    <tr ng-show="selectedAllP.Name ===  '   - Any Publisher -'" ng-click="deSelectP(selectedAllP)">
                        <td class="deselect">{{selectedAllP.Name}}</td>
                    </tr>
                </tbody>
            </table>
            <p ng-show="noticeAnyPublisher && selectedAllP.Name ===  '   - Any Publisher -'" class="notice">{{noticeAnyPublisher}}</p>
        </div>

以及上面部分div的逻辑:

 $scope.selectedAllP = [];

    $scope.setSelectedP = function (publisher) {
        $scope.selectedP = publisher.Name;
        // Check if the selected publisher is already in the array
        // if it isn't, than push it in the array (else do nothing)
        if (publisher.Name == "   - Any Publisher -"){
            $scope.selectedAllP = publisher;
            console.log($scope.selectedAllP);
        } else if ($scope.selectedAllP.Name == "   - Any Publisher -") {
            $scope.noticeAnyPublisher = 'Deselect "Any Publisher" first';
            console.log("blblblb");
        } else if ($scope.selectedAllP.indexOf(publisher) == -1) {
            $scope.selectedAllP.push(publisher);
        }
        console.log($scope.selectedP, $scope.selectedAllP);
    };

    $scope.deSelectP = function (dePublisher) {
        // Check if the selected publisher is already in the array
        // if it is, than remove it from the array (else do nothing)

        if (dePublisher.Name == "   - Any Publisher -") {
            $scope.selectedAllP = [];
            $scope.selectedP = 0;
            $scope.noticeAnyPublisher = '';
        } else {
            var idx = $scope.selectedAllP.indexOf(dePublisher);
            if (idx != -1) {
                $scope.selectedAllP.splice(idx, 1);
                $scope.selectedP = $scope.selectedAllP[0].Name;
            }
        }
    };

我希望当我选择第 4 个条件(在本例中为 || selectedAllD)时显示上面的 div，但如您所见，即使选择了分销商(并且 selectedAllD 存在于控制台中)，div 也没有展示。检查下一张图片以查看当我选择第三个条件 (selectedAllF[0]) 时显示的 div。

当我选择第三个条件 (selectedAllF[0]) 时显示的 div。它也显示了前两个条件。问题是它的行为是相同的，无论条件的顺序如何(它只考虑前 3 个条件)。

Answer 1

您可以在 ng-show 中调用方法.

<div class="row " ng-show="showRow()">

并将该函数声明到您的 .js 中文件。

$scope.showRow = function () {
    return $scope.selectedAllP[0] || $scope.selectedAllF[0] || $scope.selectedAllP || $scope.selectedAllD || $scope.level;
}