AngularJs 实现搜索功能

AngularJs implementing a search feature

本文关键字:功能 搜索 实现 AngularJs      更新时间:2023-09-26

我正在用MEAN堆栈制作一个简单的在线汽车商店。我在数据库中有一些实体,现在我正在尝试实现搜索功能。我有一个带有搜索字段的页面。单击搜索按钮时,控制器中将调用一个函数,向发送选项对象的服务器发出 post 请求。服务器使用正确的数据进行响应。问题是:搜索按钮调用搜索函数。

$scope.search = function(options) {
console.dir(options);
CarAdsService.searchByOptions(options)
  .then(function(cars) {
    $scope.cars = cars;
  }, function(err) {
    console.log(err);
  })
}

以及调用的服务函数:

searchByOptions: function(options) {
  var deferred = $q.defer();
  $http.post('/api/searchCars', {options: options})
    .success(function(cars){
    // when I log cars, the data is correct
      deferred.resolve(cars);
    })
    .error(function(err){
      deferred.reject(err);
    });

  return deferred.promise;

然后在我看来,我得到了这个:

 tr(ng-repeat="car in cars")
     td {{ car.brand.name }}
     td {{ car.model.name }}
     td {{ car.fuelType }}
     td {{ car.gearBox }}
     td {{ car.price | currency}}
     td {{ car.year }}

它位于搜索菜单中的部分中,但它不会更新。经过多次测试,$scope.cars 对象设置正确,但视图未更新。我尝试调用 $scope.$apply(),但它抛出异常,指出$digest已经在运行。你能给出如何解决这个问题的想法吗?

好吧,原来我是白痴(5个小时把头撞在墙上)

CarAdsService.searchByOptions(options)
  .then(function(cars) {
    $scope.cars = cars.cars;

响应是一个具有与数组相关的 CARS 属性的对象。