我在controller.js和gallery.html上有以下代码
.controller ('VideoGalleryController', ['$scope', 'videogalleryFactory', function($scope, videogalleryFactory){
//Values of genre searchbox
$scope.genreOptions = [
'Action',
'Adventure',
'Comedy',
'Crime',
'Drama',
'Historical',
'Horror',
'Mistery',
'Musical',
'Romance',
'Science Fiction',
'Thriller',
'Western'
];
//Get dishes from db_movies.json
videogalleryFactory.getMovies().query(
function(response) {
$scope.movies = response;
//Displays nested genres
angular.forEach($scope.movies, function(item){
console.log(item.genre);
})
},
function(response) {
$scope.message = "Error: "+response.status + " " + response.statusText;
});
}]) <div class="row row-content-cards">
<div class="col-xs-12 col-sm-9">
<!-- Title filter -->
<div class="form-group">
<label class="col-sm-3 control-label label-title" for="search">Search movie:</label>
<div class="col-sm-9">
<input type="text" class="form-control" placeholder="Search movie" ng-model="moviesfilter.title">
</div>
</div>
<!-- Genre filter -->
<div class="form-group">
<label for="genre" class="col-sm-3 control-label">Search genre</label>
<div class="col-sm-9">
<select class="form-control"
multiple
chosen
id="genre"
name="genre"
data-placeholder="Search genres"
no-results-text="'Could not find that genre'"
ng-model="???"
ng-options="s for s in genreOptions">
<option value=""></option>
</select>
</div>
</div>
</div>
</div>
<div class="container-fluid cards-row">
<div calss="hover-effect">
<div class="col-sm-6 col-md-4" ng-repeat="movie in movies | filter:moviesfilter as filtText">
<div class="hover-div">
<div class="thumbnail">
<img ng-src={{movie.cover}} alt="{{movie.alt}}" >
<div class="caption">
<h3>{{movie.title}}</h3>
<span class="badge-space badge" ng-repeat="genre in movie.genre | filter:genre"><strong>{{genre}} </strong></span>
<div class="titlewraptext">
{{movie.plot}}
</div>
<p><a href="#" class="btn btn-primary" role="button">Details</a></p>
</div>
</div>
</div>
</div>
</div>
</div>
<p ng-if="filtText.length === 0">
<strong>No results found...</strong>
<p>
</div>
我希望在Filter by genre screenshot上选择一个值来过滤整个电影。在这个例子中，只应显示“La momia”和“Gladiator”。
json文件结构如下：
{
"movies": [
{
"title": "La momia",
"releasedate": "1998-12-31T23:00:00.000Z",
"length": 125,
"genre": [
"Adventure"
],
"plot": "Durante una batalla en Egipto, el legionario Rick O'Connell y un compañero descubren las ruinas de Hamunaptra, la ciudad de los muertos. Algún tiempo después vuelven al mismo lugar con una egiptóloga y su hermano. Allí coinciden con un grupo de estadounidenses, deseosos de correr aventuras, que acabarán provocando la resurrección de la momia de un diabólico sacerdote egipcio que intenta desesperadamente recuperar a su amada.",
"cast": "Brendan Fraser, Rachel Weisz, John Hannah, Arnold Vosloo, Jonathan Hyde, Oded Fehr, Kevin J. O'Connor, Stephen Dunham, Aharon Ipalé, Tuc Watkins, Omid Djalili, Erick Avari, Carl Chase, Corey Johnson, Bernard Fox, Patricia Velasquez, Ray Donn",
"cover": "img/film_covers/lamomia.png",
"downloaddate": "2000-02-04T23:00:00.000Z",
"alt": "La momia",
"id": 1
},
{
"title": "Los juegos del hambre",
"releasedate": "2011-12-31T23:00:00.000Z",
"length": 143,
"plot": "Lo que en el pasado fueron los Estados Unidos, ahora es una nación llamada Panem; un imponente Capitolio ejerce un control riguroso sobre los 12 distritos que lo rodean y que están aislados entre sí. Cada distrito se ve obligado a enviar anualmente un chico y una chica entre los doce y los dieciocho años para que participen en los Hunger Games, unos juegos que son transmitidos en directo por la televisión. Se trata de una lucha a muerte, en la que sólo puede haber un superviviente. Katniss Everdeen, una joven de dieciséis años, decide sustituir a su hermana en los juegos; pero para ella, que ya ha visto la muerte de cerca, la lucha por la supervivencia es su segunda naturaleza.",
"cover": "img/film_covers/losjuegosdelhambre.jpg",
"cast": "Jennifer Lawrence, Josh Hutcherson, Elizabeth Banks, Woody Harrelson, Donald Sutherland, Stanley Tucci, Liam Hemsworth, Toby Jones, Lenny Kravitz, Wes Bentley, Paula Malcomson, Isabelle Fuhrman, Sandra Ellis Lafferty, Paula Malcomson, Kimiko Gelman, Nelson Ascencio, Brooke Bundy, Amandla Stenberg, Dayo Okeniyi, Leven Rambin, Jack Quaid, Latarsha Rose, Alexander Ludwig, Jacqueline Emerson",
"downloaddate": null,
"alt": "Los juegos del hambre",
"genre": [
"Action",
"Drama",
"Science Fiction"
],
"id": 2
},
{
"title": "Gladiator",
"releasedate": "2000-04-30T22:00:00.000Z",
"length": 155,
"plot": "En el año 180, el Imperio Romano domina todo el mundo conocido. Tras una gran victoria sobre los bárbaros del norte, el anciano emperador Marco Aurelio (Richard Harris) decide transferir el poder a Máximo (Russell Crowe), bravo general de sus ejércitos y hombre de inquebrantable lealtad al imperio. Pero su hijo Cómodo (Joaquin Phoenix), que aspiraba al trono, no lo acepta y trata de asesinar a Máximo.",
"cover": "img/film_covers/gladiator.jpg",
"cast": "Russell Crowe, Joaquin Phoenix, Connie Nielsen, Oliver Reed, Richard Harris, Ralf Moeller, Derek Jacobi, Djimon Hounsou, David Schofield, John Shrapnel, Spencer Treat Clark, Tomas Arana, David Hemmings, Tommy Flanagan, Sven-Ole Thorsen, Tony Curran, Giorgio Cantarini, Omid Djalili, Giannina Facio, Michael Sheen",
"downloaddate": null,
"alt": "Gladiator",
"genre": [
"Action",
"Adventure",
"Drama",
"Historical"
],
"id": 3
}
],
"series": []
}
答案 0 :(得分：0)
这样做。
let target_genre = 'Adventure'; // what your user selected
let movies = obj.movies; // your movies array from your JSON
// Find out if a movie's genres contains the target genre
// If so, return it to the new array.
let movies_filtered = movies.filter ( x => {
return x.genre.indexOf ( target_genre ) >= 0 } );
console.log ( movies_filtered ); // two movies
编辑：由于实际使用是一系列流派，在这里你可以测试＆＃34;任何类型匹配＆＃34;，或者＃34;所有类型匹配＆＃34;。请注意，现在的假设是，如果它可以是一个类型的数组，它应该总是一个类型的数组，即使它是一个长的，否则你必须写＆＃34;如果它＆＆34; ＃39; s数组是这样做的，如果不这样做，＆＃34;码。如果它总是一个阵列，即使是一个长阵，你也总是这样做，它就是一个数组＆＃34;办法。
let target_genres = [ 'Adventure', 'Drama', 'Historical' ];
let movies = obj.movies; // your movies array
// Returns if any genre matches
let movies_filtered = movies.filter ( x => {
return target_genres.filter ( y => {
return x.genre.indexOf ( y ) >= 0;
}).length; // if length is 0, that's "false", anything else is "true".
});
// Returns if all genres match
let movies_filtered = movies.filter ( x => {
let originalLength = target_genres.length;
return target_genres.filter ( y => {
return x.genre.indexOf ( y ) >= 0;
}).length === originalLength; // filtered array length must match original length
});
答案 1 :(得分：0)
您可以将此解决方案与es6一起使用：）
const filteredMoviesByGenreType = (data, genreType) => {
// access to object with key "movies" in data via spread operator and dot notation and filtering by genreType
return [...data.movies]
.filter(movie => movie["genre"]
.includes(genreType));
}
其中data是来自服务器的整个json数据。
例如仅输出戏剧的类型：
filteredMoviesByGenreType(data, "Drama");
[[object Object] {
alt: "Los juegos del hambre",
cast: "Jennifer Lawrence, Josh Hutcherson, Elizabeth Banks, Woody Harrelson, Donald Sutherland, Stanley Tucci, Liam Hemsworth, Toby Jones, Lenny Kravitz, Wes Bentley, Paula Malcomson, Isabelle Fuhrman, Sandra Ellis Lafferty, Paula Malcomson, Kimiko Gelman, Nelson Ascencio, Brooke Bundy, Amandla Stenberg, Dayo Okeniyi, Leven Rambin, Jack Quaid, Latarsha Rose, Alexander Ludwig, Jacqueline Emerson",
cover: "img/film_covers/losjuegosdelhambre.jpg",
downloaddate: null,
genre: ["Action", "Drama", "Science Fiction"],
id: 2,
length: 143,
plot: "Lo que en el pasado fueron los Estados Unidos, ahora es una nación llamada Panem; un imponente Capitolio ejerce un control riguroso sobre los 12 distritos que lo rodean y que están aislados entre sí. Cada distrito se ve obligado a enviar anualmente un chico y una chica entre los doce y los dieciocho años para que participen en los Hunger Games, unos juegos que son transmitidos en directo por la televisión. Se trata de una lucha a muerte, en la que sólo puede haber un superviviente. Katniss Everdeen, una joven de dieciséis años, decide sustituir a su hermana en los juegos; pero para ella, que ya ha visto la muerte de cerca, la lucha por la supervivencia es su segunda naturaleza.",
releasedate: "2011-12-31T23:00:00.000Z",
title: "Los juegos del hambre"
}, [object Object] {
alt: "Gladiator",
cast: "Russell Crowe, Joaquin Phoenix, Connie Nielsen, Oliver Reed, Richard Harris, Ralf Moeller, Derek Jacobi, Djimon Hounsou, David Schofield, John Shrapnel, Spencer Treat Clark, Tomas Arana, David Hemmings, Tommy Flanagan, Sven-Ole Thorsen, Tony Curran, Giorgio Cantarini, Omid Djalili, Giannina Facio, Michael Sheen",
cover: "img/film_covers/gladiator.jpg",
downloaddate: null,
genre: ["Action", "Adventure", "Drama", "Historical"],
id: 3,
length: 155,
plot: "En el año 180, el Imperio Romano domina todo el mundo conocido. Tras una gran victoria sobre los bárbaros del norte, el anciano emperador Marco Aurelio (Richard Harris) decide transferir el poder a Máximo (Russell Crowe), bravo general de sus ejércitos y hombre de inquebrantable lealtad al imperio. Pero su hijo Cómodo (Joaquin Phoenix), que aspiraba al trono, no lo acepta y trata de asesinar a Máximo.",
releasedate: "2000-04-30T22:00:00.000Z",
title: "Gladiator"
}]