如何从 Angular 2 中的 JSON 对象中读取想要的数据?

Posted

技术标签:

【中文标题】如何从 Angular 2 中的 JSON 对象中读取想要的数据?【英文标题】:How to just read wanted data from JSON object in Angular 2? 【发布时间】:2016-05-29 15:59:34 【问题描述】:

我在读取和记录这样的 JSON 文件时遇到问题:


"results" : [
  
     "address_components" : [
        
           "long_name" : "277",
           "short_name" : "277",
           "types" : [ "street_number" ]
        ,
        
           "long_name" : "Bedford Avenue",
           "short_name" : "Bedford Ave",
           "types" : [ "route" ]
        ,
        
           "long_name" : "Williamsburg",
           "short_name" : "Williamsburg",
           "types" : [ "neighborhood", "political" ]
        ,
        
           "long_name" : "***lyn",
           "short_name" : "***lyn",
           "types" : [ "sublocality_level_1", "sublocality", "political" ]
        ,
        
           "long_name" : "Kings County",
           "short_name" : "Kings County",
           "types" : [ "administrative_area_level_2", "political" ]
        ,
        
           "long_name" : "New York",
           "short_name" : "NY",
           "types" : [ "administrative_area_level_1", "political" ]
        ,
        
           "long_name" : "United States",
           "short_name" : "US",
           "types" : [ "country", "political" ]
        ,
        
           "long_name" : "11211",
           "short_name" : "11211",
           "types" : [ "postal_code" ]
        
     ],
     "formatted_address" : "277 Bedford Ave, ***lyn, NY 11211, USA",
     "geometry" : 
        "location" : 
           "lat" : 40.714232,
           "lng" : -73.9612889
        ,
        "location_type" : "ROOFTOP",
        "viewport" : 
           "northeast" : 
              "lat" : 40.7155809802915,
              "lng" : -73.9599399197085
           ,
           "southwest" : 
              "lat" : 40.7128830197085,
              "lng" : -73.96263788029151
           
        
     ,
     "place_id" : "ChIJd8BlQ2BZwokRAFUEcm_qrcA",
     "types" : [ "street_address" ]
  ,
  ],
  "status" : "OK"
  

我只需要城市名称,而不是所有这些数据。我怎么能记录只是想要的对象行。

我尝试了这段代码,但它并没有像我想要的那样工作:

Object.keys(JSON[0]);

【问题讨论】:

***.com/questions/6359995/… 您想要“277 Bedford Ave, ***lyn, NY 11211, USA”还是只是“布鲁克林”? 您的数据中包含哪些“城市”? 【参考方案1】:

您可以按sublocality_level_1 进行过滤,并在函数中执行此操作以在您收到排序不同的类似 JSON 时重复使用它。

const getCity = data => data.address_components
      .filter(x => x.types && x.types.indexOf("sublocality_level_1") > -1)
      .map(x => x.long_name)[0];

//Get a city name from only the first result 
const oneCity = getCity(jsonData.results[0]);

//Get an array with all cities (for all the results)
const allCities = jsonData.results.map(getCity);

【讨论】:

【参考方案2】:

对于您的示例数据

>> data['results'][0]['address_components'][2]['long_name']
Williamsburg

>> data['results'][0]['address_components'][3]['long_name']
***lyn

如果你得到的数据是 JSON 字符串,你需要先把它转换成 javascript 对象

data = JSON.parse(the_json_string_here);

【讨论】:

以上是关于如何从 Angular 2 中的 JSON 对象中读取想要的数据?的主要内容,如果未能解决你的问题,请参考以下文章

(IONIC - Angular)我如何在 html 卡片中仅显示符合特定条件的 JSON 中的某些对象?

Angular 2将JSON对象解析为角度类[重复]

如何在 Angular 中为嵌套的 JSON 对象使用搜索过滤器?

如何从 Angular 4 中的 JSON 文件中获取 json 数据

Beautiful Soup 如何解码 <script> 对象中的 html json 数据

如何从 Angular2(Typescript)中的 Json 数组中获取值的总和