Question

我有一个带有表格列＆＃39;状态＆＃39;的甘特图。该列可以具有多个值（活动，关闭，运行，停止）。我希望能够通过项目状态列过滤多个值，例如，为每个状态值设置多个复选框（活动，关闭..等）。

我知道你可以将输入文本绑定到这样的行过滤器，但是如果我想在同一个过滤器中有多个vlaues呢？

<input type="text" data-ng-model="options.filterRow" />
                                <div gantt="gantt" 
                                        data="data" 
                                        options="options"
                                        filter-row="{'status': options.filterRow}">
                                    <gantt-table columns="['model.status']"></gantt-table>
                                    <gantt-tree></gantt-tree>
                                    <gantt-groups></gantt-groups>
                                    <gantt-tooltips></gantt-tooltips>
                                    <gantt-bounds></gantt-bounds>
                                    <gantt-progress></gantt-progress>
                                    <gantt-sortable></gantt-sortable>
                                    <gantt-movable></gantt-movable>
                                    <gantt-draw-task></gantt-draw-task>
                                    <gantt-resize-sensor></gantt-resize-sensor>
                                </div>

Answer 1

我找到了解决问题的方法。

<select id="status" data-ng-model="filter1"><option .. /></select>
<select id="project" data-ng-model="filter2"><option .. /></select>

<div gantt="gantt" data="data" options="options" filter-row="filterFunction" current-date="column" current-date-value="getToday" column-width="100"
                            api="registerApi">
                            <gantt-table columns="['model.name', 'model.planned', 'model.delayed']"
                                headers="{'model.name': 'Project', 'model.planned': 'Planned [days]', 'model.delayed': 'Delayed [days]'}"
                                classes="{'model.name': 'gantt-project', 'model.planned' : 'gantt-column-days', 'model.delayed' : 'gantt-column-days'}"> </gantt-table>
                            <gantt-tree></gantt-tree>
                            <gantt-groups></gantt-groups>
                            <gantt-tooltips></gantt-tooltips>
                            <gantt-bounds></gantt-bounds>
                            <gantt-progress></gantt-progress>
                            <gantt-sortable></gantt-sortable>
                            <gantt-movable enabled="false"></gantt-movable>
                            <gantt-draw-task></gantt-draw-task>
                            <gantt-resize-sensor></gantt-resize-sensor>
                        </div>

这是在角度控制器内部。

    $scope.registerApi = function(api) {
        $scope.api = api;
    }

    // refresh grid on filter change
    for (i=0 ; i<filters.length; i++) {
        $scope.$watch('filter'+filters[i], function() {
            $scope.api.rows.refresh();
        })
    }

    $scope.filterFunction = function(row){
        var valid = true;
        //all filters implementations go here
        return valid;
    }

定制角度甘特行滤波器

1 个答案: