在（Kendo Grid Angular 2）过滤器菜单中，如何隐藏额外的过滤器和操作员下拉列表

Question

在Angular 2的Kendo UI中：

1-如何隐藏额外的滤镜选项（图片底部的滤镜）。

2-对于第一个（剩余的）过滤器：如何设置默认操作然后隐藏操作下拉列表？

Answer 1

css解决方法可以是这样的：

kendo-grid-filter-menu-container {
    kendo-dropdownlist.k-filter-and {
        display: none !important;
    }

    kendo-grid-string-filter-menu-input,
    kendo-grid-date-filter-menu-input  {
        &:nth-child(1) {
            kendo-grid-filter-menu-input-wrapper {
                kendo-dropdownlist:nth-child(1) {
                    display: none !important;
                }
            }
        }
        &:nth-child(3) {
            display: none !important;
        }
    }
}

但我仍然需要更好的剑道配置。

Answer 2

您可以在[extra]="false"组件上设置kendo-grid-date-filter-menu来隐藏额外的过滤器。 （API Reference）

可以使用operator输入设置默认运算符。

示例：

<kendo-grid-column field="myDate" title="Title">
    <ng-template kendoGridFilterMenuTemplate
        let-filter let-column="column" let-filterService="filterService"> 

        <kendo-grid-date-filter-menu
          [column]="column" [filter]="filter" [filterService]="filterService"
          [extra]="false"
          operator="eq"
        >
        </kendo-grid-date-filter-menu>

    </ng-template>
</kendo-grid-column>

当涉及隐藏operator-dropdown时，filter-menu现在没有配置选项。 对于行过滤器方法，可以通过设置[showOperators]="false"。

来实现

您可以通过css隐藏它来解决此限制（但这仍然是一种解决方法），或者通过实现符合您要求的自定义过滤器。 （Documentation）

Answer 3

您可以使用the default filter operator作为参考。

下面的示例演示如何配置字符串过滤器并默认选择“包含”运算符，也可以使用此标记使用其顺序指定活动的过滤器运算符： vocab_size

<kendo-filter-(operatorName)-operator>

Answer 4

<kendo-grid-column field="OrderDate" title="Order Date">
    <ng-template kendoGridFilterCellTemplate let-filter let-column="column">
        <kendo-grid-date-filter-cell [showOperators]="false" [column]="column" [filter]="filter">
        </kendo-grid-date-filter-cell>
    </ng-template>
</kendo-grid-column>

---

[showOperators]="false" it work for me. Hide other operators

源链接：DateFilterCellComponent