Question

我想将过滤器移出HTML并在控制器内部。有关该功能的外观的任何建议吗？

<div class="dropdown">
<button class="btn btn-small btn-primary" type="button" data-toggle="dropdown">Filter
<span class="caret"></span></button>
<ul class="dropdown-menu dropdown-outer">
    <div class="dropdown-inner">
        <div class="inner-addon right-addon dropdown-padding">
            <i ng-click="filteredItem.name = ''" class="glyph glyphicon glyphicon-remove-circle"></i>
            <input class="form-control" data-keepOpenOnClick type="text" ng-trim="true" ng-model="filteredItem.name" placeholder="Filter by File Name"/>
        </div>
        <div class="inner-addon right-addon dropdown-padding">
            <i ng-click="filteredItem.prettyName = ''" class="glyph glyphicon glyphicon-remove-circle"></i>
            <input class="form-control" data-keepOpenOnClick type="text" ng-trim="true" ng-model="filteredItem.prettyName" placeholder="Filter by Name"/>
            </div>
        <div class="inner-addon right-addon dropdown-padding">
            <i ng-click="filteredItem.type = ''" class="glyph glyphicon glyphicon-remove-circle"></i>
            <input class="form-control" data-keepOpenOnClick type="text" ng-trim="true" ng-model="filteredItem.type" placeholder="Filter by Type" typeahead="type.pretty_name for type in widgetType" required />
        </div>
        <div class="dropdown-padding">
            <button ng-click="resetfilteredItem()" class="btn btn-small btn-primary" type="button" data-toggle="dropdown">Reset
        </div>
    </div>
</ul>
</div>
<div class="list-group" ng-repeat="filter in filteredItems = (ideas | filter: (!!filteredItem.name || !!filteredItem.prettyName || !!filteredItem.type || undefined) && filteredItem)">
 <div class="list-group-item widgets-group-item" ng-mouseover="showname=true" ng-mouseleave="showname=false" dnd-draggable="dragToWidgetConfig(widget)" dnd-effect-allowed="copy">
{{filter.prettyName}}
 </div>
</div>

Answer 1

我能够找到解决方案。只需将此范围添加到控制器

即可

$scope.filteredItems = {};

并更新HTML解决了我的问题。

<div class="list-group" ng-repeat="item in filteredItems = (items | filter: filteredItems)">
</div>

如何将angularjs html过滤器移动到控制器？

1 个答案: