Как включить пользовательский фильтр в пользовательскую директиву angularjs? - PullRequest
0 голосов
/ 02 марта 2019

, поэтому я пытаюсь создать пользовательскую директиву, которая работает с пользовательским фильтром.Таким образом, в основном директива применяется к заголовкам таблицы для фильтрации строк на основе пользовательского ввода.Это нормально работает, если я не использую директиву, но я хочу использовать директиву, и я не уверен, что не хватает.

Вот мой фильтр:

.filter('comparisonFilter', function() {
    return function(input, filterObject) {
        if(filterObject === undefined || !filterObject.value || filterObject.value === "" || !filterObject.type || filterObject.type === "") return input;

        console.log(filterObject);
        var property = filterObject.property, 
            value = filterObject.value,
            type = filterObject.type;

        return _.filter(input, function(obj) {
            if(type === ">=") return (obj[property] > value || obj[property] == value);
            else if(type === "<=") return (obj[property] < value || obj[property] == value);
            else if(type === "=") return obj[property] == value;
        });
    };
});

директива:

.directive('comparisonFilter', function(){
    return {
        restrict: 'EA',
        template: `
            <select data-ng-model="comparisonFilterData.type">
                <option value="" selected>Select Filter</option>
                <option value=">=">>=</option>
                <option value="<="><=</option>
                <option value="=">=</option>
            </select>
            <input type="text" data-ng-model="comparisonFilterData.value"
                   class="form-control input-sm">
        `,
        scope: {
            property: '='
        },
        link: function(scope, element, attrs) {
            scope.comparisonFilterData = {
                type: '',
                value: '',
                property: attrs.property,
            };
        }
    }
});

HTML-файл:

<table>
<thead>
    <tr>
        <th>
            <data-comparison-filter property="something" />
        </th>
    </tr>
</thead>
<tbody>
    <tr data-ng-repeat="item in resultValue=(items | comparisonFilter: comparisonFilterData)">
        <td>
            <span>{{item.something}}</span>
        </td>
    </tr>
</tbody>

...