javascript - 使用 AngularJS 的默认过滤器和用户定义过滤器的输入字段

Question

这个问题一定有一个简单的答案，但我不明白。我使用以下输入元素通过 AngularJS 过滤表中的结果。如果我在输入字段中手动输入“foo”，该表将过滤“foo”。但是我的硬编码值“foo”(在输入的 value 属性中)既不会显示在浏览器中，也不会在页面加载时过滤结果。如何使该输入字段同时提供默认过滤器和用户定义的过滤器？提前致谢。

<input ng-model="search" id="search" type="text" placeholder="Search" value="foo">
<div ng-controller="eventsController")>
    <table>
        <tr ng-repeat="event in events | filter:search">
            <td><span ng-bind="event.title"></span></td>
            <td><span ng-bind="event.date_start"></span></td>
        </tr>
    </table>
</div>
<script>
    function EventsController($scope, $http) {
        $http.get('/api/all-events').success(function(events) {
            $scope.events = events;
        });
    }
</script>

Answer 1

如果您使用 ng-model 那么您不应该在 html 中设置您的值。相反，您应该在 Angular 中设置模型值。因此，摆脱 value="foo"并执行此操作。

function EventsController($scope, $http) {
        $http.get('/api/all-events').success(function(events) {
            $scope.events = events;
            $scope.search = "foo"; //This will set the models search to foo 
        });
    }