Angular 1: multiple conditions with multiple conditions OR how to exclude conditions if other conditions are true

Question

Right now I have created an extra span to hold one condition.

<div ng-repeat="(key, resultLinks) in resultGroup.resultLinks">
    <div ng-if="key < 4 || viewMore" ng-repeat="(subKey, linksWrap) in resultLinks.linksWrap">
        <span ng-if="wWidth > 568 || subKey == 0" ng-repeat="links in linksWrap.links">
                {{links.linkName}}
        </span>
    </div>
</div>

How would you change it so that all the conditions are in one div. Ie: ng-if="(key < 4 || viewMore) || (wWidth > 568 || subKey == 0)" (something like this, but not quite). Like is it possible to somehow exclude one condition if another is true?

Answer 1

is it possible to somehow exclude one condition if another is true?

That is exactly what OR ( || ) operator is doing. If (key < 4 || viewMore) is true it will not go further, (wWidth > 568 || subKey == 0) will not execute.

This should work:

    <div ng-if="(key < 4 || viewMore) || (wWidth > 568 || subKey == 0)" ng-repeat="(subKey, linksWrap) in resultLinks.linksWrap">
        <span ng-repeat="links in linksWrap.links">
               {{links.linkName}}
        </span>
    </div>

As you can see it looks pretty ugly. I would move logic out of template:

<div ng-if="isVisible(key, subKey)"... >

Somewhere in your controller:

$scope.isVisible = function(key, subKey){  
    return (key < 4 || $scope.viewMore) || ($scope.wWidth > 568 || subKey == 0)
}

Answer 2

这是您要找的东西吗？

(key < 4 || viewMore) && (wWidth > 568 || subKey == 0)