, поэтому я пытаюсь создать пользовательскую директиву, которая работает с пользовательским фильтром.Таким образом, в основном директива применяется к заголовкам таблицы для фильтрации строк на основе пользовательского ввода.Это нормально работает, если я не использую директиву, но я хочу использовать директиву, и я не уверен, что не хватает.
Вот мой фильтр:
.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>