Question

我构建了一个Angular函数，允许用户使用输入字段进行搜索查询。用户可以搜索电影标题，该函数将向TheMovieDB发出请求并返回带有数据的JSON文件。

$scope.search = function() {

  var base = 'http://api.themoviedb.org/3';
  var service = '/search/movie';
  var apiKey = 'a8f7039633f2065942cd8a28d7cadad4&query='
  var search = $scope.searchquery
  var callback = 'JSON_CALLBACK'; // provided by angular.js
  var url = base + service + '?api_key=' + apiKey + search + '&callback=' + callback;

  $http.jsonp(url,{ cache: true}).
    success(function (data, status, headers, config) {

      if (status == 200) {
        $scope.movieList = data.results;
        console.log($scope.movieList)
      } else {
        console.error('Error happened while getting the movie list.')
      }

    }).
    error(function (data, status, headers, config) {
      console.error('Error happened while getting the movie list.')
    });
}

然后我在模板中显示该数据。

%div{"ng-controller" => "searchCtrl", :id => "container_search"}

  %input{"ng-change" => "search(searchquery)", "ng-model" => "searchquery", "ng-model-options" => "{ debounce: 500 }", :id => "search_input", :placeholder => "Search a movie!", "ng-keyup" => "clear_results()"}
  %ul#showresults
    %li.search_results{"ng-repeat" => "movie in movieList | orderBy:'-release_date'"}

      .addmovie{"ng-click" => "addMovie()"}
        %span
          Add Movie
      %img.poster{"ng-src" => "http://image.tmdb.org/t/p/w500/{{ movie.poster_path }}"}
      %span.title
        {{ movie.original_title }}
      %span.release
        {{ movie.release_date  | date:"yyyy" }}
      %span.movieID
        {{ movie.id }}

问题是有些电影没有发布日期。我希望从模板中筛选出这些结果。但我无法找到关于如何创建它的好示例或教程。

Answer 1

只需在%li.search_results{"ng-repeat" => "movie in movieList | orderBy:'-release_date' | filter:{'release_date':''}"}

中添加过滤条件即可

{{1}}

Answer 2

muenchdo的回答仅适用于null / undefined值...

我会使用来自AngularJS - Filter empty objects的ng-if指令有一个更强大的解决方案...（最干净的方式可能是一个过滤器，但包括更多的代码）

过滤掉没有值的结果

2 个答案: