根据条件显示div(ul是否有孩子)

时间:2016-09-22 01:17:32

标签: c# jquery html asp.net-mvc razor

请参阅下面的代码。 我想显示#non-alphabet如果.refinement-options没有child(品牌选项)。 我怎么能这样做?

*请参阅下面的进一步说明。

<div class="alphabets-container">
                <div owl-carousel owl-configuration='{"items" : 27, "itemsDesktopSmall" : [992,20], "itemsTablet" : [768,10], "itemsMobile" : [479, 10], "itemsDesktopMedium" : [1200,27], "itemsDesktop" : false, "pagination" : false, "autoPlay" : false}'>

                    <div class="list-item" id="non-alphabet"><a ng-class="{active : isAlphabetSelected('#')}" ng-click="filterBrand('#')">#</a></div>

                    @foreach (var character in brandCategories)
                    {
                        <div class="list-item">
                            <a class="alphabet-option" ng-class="{active : isAlphabetSelected('@character')}" ng-click="filterBrand('@character')">@character</a>
                        </div>
                    }
                </div>
            </div>
            <ul class="refinement-options reflex-container reflex-wrap filter-group" data-filter-type="brand">
                <li class="brand-option reflex-col-3" ng-repeat="item in items | startsWithLetter:filterKey">
                    <input type="checkbox" class="css-checkbox" ng-checked="item.IsChecked" ng-model="item.IsChecked" id="{{ item.Id }}" name="{{ item.Name }}" value="{{ item.QueryValue }}" data-base-url="{{ item.BaseUrl }}" data-link-url="{{ item.LinkUrl }}" />
                    <label for="{{ item.Id }}" class="checkbox css-label">{{ item.DisplayText }} ( {{ item.HitCount }} )</label>
                </li>
            </ul>

enter image description here

“#”标签中没有选项,因此如果“#”为空,我希望将其删除或隐藏 No options in '#' tab, there

我使用ng-show做了类似的事情,但它没有按预期工作。请纠正我。

在控制器

$scope.showLetter = function() {
        if ($('.brand-option').length == 0){
            return false;
        }

        return true;
    };

标记

<div class="list-item" id="non-alphabet" ng-show="showLetter()"><a ng-class="{active : isAlphabetSelected('#')}" ng-click="filterBrand('#')" ng-disabled="">#</a></div>

1 个答案:

答案 0 :(得分:1)

在div上使用ng-show,其功能是否显示。

+

在你的角度控制器中就是这样的东西。浏览每个项目,如果任何项目没有以字母开头,请显示#

<div class="list-item" id="non-alphabet" ng-show="showHash()"><a ng-class="{active : isAlphabetSelected('#')}" ng-click="filterBrand('#')">#</a></div>