如何在json中获取评级数组

Question

Hello StackOverflow用户：

我正在调整一个使用omdb api搜索电影的网站，我是新手使用json和Ajax。该网站使用淘汰赛js框架。我的问题是：你如何设置一个knockout observable命令行来收集一个看起来像一个信息数组的json设置。我正试图抓住这个json的评级部分（该部分以粗体突出显示）

{
"Title": "Batman Begins",
"Year": "2005",
"Rated": "PG-13",
"Released": "15 Jun 2005",
"Runtime": "140 min",
"Genre": "Action, Adventure, Thriller",
"Director": "Christopher Nolan",
"Writer": "Bob Kane (characters), David S. Goyer (story), Christopher Nolan (screenplay), David S. Goyer (screenplay)",
"Actors": "Christian Bale, Michael Caine, Liam Neeson, Katie Holmes",
"Plot": "After training with his mentor, Batman begins his fight to free crime-ridden Gotham City from the corruption that Scarecrow and the League of Shadows have cast upon it.",
"Language": "English, Urdu, Mandarin",
"Country": "USA, UK",
"Awards": "Nominated for 1 Oscar. Another 14 wins & 71 nominations.",
"Poster": "https://images-na.ssl-images-amazon.com/images/M/MV5BYzc4ODgyZmYtMGFkZC00NGQyLWJiMDItMmFmNjJiZjcxYzVmXkEyXkFqcGdeQXVyNDYyMDk5MTU@._V1_SX300.jpg",
**"Ratings": [
{
"Source": "Internet Movie Database",
"Value": "8.3/10"
},
{
"Source": "Rotten Tomatoes",
"Value": "84%"
},
{
"Source": "Metacritic",
"Value": "70/100"
}
],**
"Metascore": "70",
"imdbRating": "8.3",
"imdbVotes": "1,099,197",
"imdbID": "tt0372784",
"Type": "movie",
"DVD": "18 Oct 2005",
"BoxOffice": "$204,100,000",
"Production": "Warner Bros. Pictures",
"Website": "http://www.batmanbegins.com/",
"Response": "True"
}

这些是用于获取数据的ko设置：

self.currentMovie = {
        Type: ko.observable(),
        Year: ko.observable(),
        Genre: ko.observable(),
        Released: ko.observable(),
        Runtime: ko.observable(),
        Poster: ko.observable(),
        Rated: ko.observable(),
        imdbRating: ko.observable(),
        imdbVotes: ko.observable(),
        Ratings:ko.observable().Source = "Rotten Tomatoes",
        Actors: ko.observable(),
        Plot: ko.observable(),
        Writer: ko.observable(),
        Director: ko.observable(),
        Country: ko.observable(),
        Language: ko.observable(),
        Title: ko.observable()

    };

我的第一个冲动是设置这样的可观察量：

Ratings:ko.observable().Source = "Rotten Tomatoes",

但所有这一切都是逐字列出信息，而不是其他信息。我应该使用ko.observableArray还是我可以使用其他设置？

Answer 1

首先，如果API提供信息作为数组，则应使用Observable Array。接下来，您说要过滤数组以仅获取具有烂番茄分数的对象，并将“值”作为可观察对象访问。正确？

Knockout提供实用程序功能（阅读更多here），包括一个用于过滤名为ko.utils.arrayFilter的数组。所以你可以这样做：

self.currentMovie = {
....
RatingsArray: ko.observableArray(),
....
}

var ratingFilterFunction = function (obArray) {
    var trimmedArray = ko.utils.arrayFilter(obArray(), function (item) {
        return item["Source"] === 'Rotten Tomatoes';
    });
    return ko.observable(trimmedArray[0]["Value"]);
};

self.CurrentMovie.Ratings = ratingFilterFunction(self.CurrentMovie.RatingsArray);

Answer 2

function vm(){
var self = this;
var allList = {
"Title": "Batman Begins",
"Year": "2005",
"Rated": "PG-13",
"Released": "15 Jun 2005",
"Runtime": "140 min",
"Genre": "Action, Adventure, Thriller",
"Director": "Christopher Nolan",
"Writer": "Bob Kane (characters), David S. Goyer (story), Christopher Nolan (screenplay), David S. Goyer (screenplay)",
"Actors": "Christian Bale, Michael Caine, Liam Neeson, Katie Holmes",
"Plot": "After training with his mentor, Batman begins his fight to free crime-ridden Gotham City from the corruption that Scarecrow and the League of Shadows have cast upon it.",
"Language": "English, Urdu, Mandarin",
"Country": "USA, UK",
"Awards": "Nominated for 1 Oscar. Another 14 wins & 71 nominations.",
"Poster": "https://images-na.ssl-images-amazon.com/images/M/MV5BYzc4ODgyZmYtMGFkZC00NGQyLWJiMDItMmFmNjJiZjcxYzVmXkEyXkFqcGdeQXVyNDYyMDk5MTU@._V1_SX300.jpg",
"Ratings": [
{
"Source": "Internet Movie Database",
"Value": "8.3/10"
},
{
"Source": "Rotten Tomatoes",
"Value": "84%"
},
{
"Source": "Metacritic",
"Value": "70/100"
}
],
"Metascore": "70",
"imdbRating": "8.3",
"imdbVotes": "1,099,197",
"imdbID": "tt0372784",
"Type": "movie",
"DVD": "18 Oct 2005",
"BoxOffice": "$204,100,000",
"Production": "Warner Bros. Pictures",
"Website": "http://www.batmanbegins.com/",
"Response": "True"
}

self.Rating = ko.observable(allList.Ratings.find(o => o.Source === 'Rotten Tomatoes'));
}

// Activates knockout.js
ko.applyBindings(new vm());

<script src="https://cdnjs.cloudflare.com/ajax/libs/knockout/3.4.2/knockout-min.js"></script>
<!-- This is a *view* - HTML markup that defines the appearance of your UI -->
 <div data-bind="text: Rating().Value">
 </div>

假设您通过ajax调用收到了您的JSON到allList对象。您可以通过allList.Ratings获取您的评级数组，您可以在其中获得所需的来源。你可能会这样做

self.Rating = ko.observable(allList.Ratings.find(o => o.Source === 'Rotten Tomatoes'));

假设您在moviesRatingJson对象中拥有所需的评级JSON