Javascript 停止AngularJS即时搜索
我在AngularJS应用程序中构建了一个简单的搜索表单,当你输入时,它使用angular内置的过滤魔法来过滤手机列表。我在表单中包装了我的表单,因为当用户提交表单时,它也会进行筛选,但会创建一个查询字符串,以便您可以从列表中导航并返回等 HTML:Javascript 停止AngularJS即时搜索,javascript,angularjs,Javascript,Angularjs,我在AngularJS应用程序中构建了一个简单的搜索表单,当你输入时,它使用angular内置的过滤魔法来过滤手机列表。我在表单中包装了我的表单,因为当用户提交表单时,它也会进行筛选,但会创建一个查询字符串,以便您可以从列表中导航并返回等 HTML: <form class="form-search" ng-submit="$parent.queryChanged()"> <div class="control-group">
<form class="form-search" ng-submit="$parent.queryChanged()">
<div class="control-group">
<label class="control-label" for="filter">Filter:</label>
<div class="controls">
<input name="q" ng-model="$parent.query" id="filter" type="text">
</div>
</div>
</form>
我想做的是禁用即时搜索,这样用户只提交表单,而不会单独在keyup上获取结果。如何执行此操作?对输入的ng模型(
ng模型=“$parent.query”
)和过滤器的参数(|过滤器:过滤器查询
)使用两个不同的变量。这将使输入和过滤器彼此无关。然后在提交表单时(在queryChanged
中),使用ng模型的值更新筛选参数($scope.filterQuery=$scope.query
)。尝试了这一点,但在提交表单后(现在添加或更新了查询字符串),除非我再次点击提交,否则不会筛选结果。假设因为我已更新filterQuery,但列表已呈现?更新filterQuery应触发新呈现。你能做一把小提琴来重现你所看到的行为吗?啊,那是因为我没有在queryChanged之外使用查询。谢谢
phonecatControllers.controller('PhoneListCtrl', ['$scope', 'Phone', '$location',
function($scope, Phone, $location) {
$scope.query = $location.search()['q'];
$scope.queryChanged = function () {
$location.search('q', $scope.query)
}
$scope.phones = Phone.query();
$scope.orderProp = 'age';
}]);