如何将评级数组抓取到json中

Question

您好 StackOverflow 用户：

我正在调整一个使用 omdb api 来搜索电影的网站，而且我对使用 json 和 Ajax 不熟悉。该网站使用淘汰赛js框架。我的问题是：你如何设置一个可淘汰的可观察命令行来收集一个看起来像一个信息数组的 json 设置。我正在尝试获取此 json 的 Ratings 部分（该部分以 bold 突出显示）

{
"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()

    };

我的第一个冲动是像这样设置 observable：

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

但所做的只是逐字列出信息，而不是其余信息。我应该使用 ko.observableArray 还是可以使用其他设置？

Answer 1

首先，如果 API 以数组的形式提供信息，您应该使用 Observable 数组。接下来，您说您要过滤数组以仅获取具有 Rotten Tomatoes 分数的对象，并将“值”作为可观察对象访问。对吗？

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>

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

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

假设您在 moviesRatingJson 对象中有所需的 Ratings JSON