Question

尝试使用observables从json-server获取JSON数组，然后将该值提供给前端并在通过observable接收的JSON数组上执行搜索

创建了一个服务，并使用HTTP get连接到服务器并订阅了该服务器创建for循环以从订阅的返回值中获取价值

**service.ts**
export class FormdtService {
  baseul='http://localhost:3000/objects'//jsonserver url
  constructor(private http:HttpClient) { }
  getdt():Observable<any>{
    return this.http.get(this.baseul)
  }
}

**component.ts**
export class FormsComponent implements OnInit {
  constructor(public fbu:FormBuilder,private fdts:FormdtService) {}
  //creates the reactive form
 form=this.fbu.group({
    un:'',
    id:''
   })
 //  baseul='http://localhost:3000/objects/';
//ngsubmit control of form brings this function
  ser(){
    this.fdts.getdt().subscribe(dt=>{
      console.log("data: "+dt[0])
      this.formdt.push(dt)
      //console.log("formdt :"+this.formdt[0])
    for (let ite in this.formdt){
      let ite1=JSON.parse(ite)
     // console.log("ite :"+this.formdt[ite]);
      //console.log("ite1"+ite1);
      this.idlist.push(ite1.person.bioguideid.value)
if(ite1.person.bioguideid.stringify==this.idsearch)
this.objson=ite1
    }});
  }
idsearch:string
formdt:string[]
idlist:string[]
objson:JSON
  ngOnInit() {

  }
 //this function is attached to button in frontend
 ser(){
    this.fdts.getdt().subscribe(dt=>
this.formdt.push(dt)//subscribes to service
    for (let ite in this.formdt){
      let ite1=JSON.parse(ite)
      this.idlist.push(ite1.person.bioguideid.value)
if(ite1.person.bioguideid.value==this.idsearch)
this.objson=ite1
  })}

**json**
[
  {
    "caucus": null,
    "congress_numbers": [
      114,
      115,
      116
    ],
    "current": true,
    "description": "Senior Senator for Tennessee",
    "district": null,
    "enddate": "2021-01-03",
    "extra": {
      "address": "455 Dirksen Senate Office Building Washington DC 20510",
      "contact_form": "http://www.alexander.senate.gov/public/index.cfm?p=Email",
      "fax": "202-228-3398",
      "office": "455 Dirksen Senate Office Building",
      "rss_url": "http://www.alexander.senate.gov/public/?a=rss.feed"
    },
    "leadership_title": null,
    "party": "Republican",
    "person": {
      "bioguideid": "A000360",
      "birthday": "1940-07-03",
      "cspanid": 5,
      "firstname": "Lamar",
      "gender": "male",
      "gender_label": "Male",
      "lastname": "Alexander",
      "link": "https://www.govtrack.us/congress/members/lamar_alexander/300002",
      "middlename": "",
      "name": "Sen. Lamar Alexander [R-TN]",
      "namemod": "",
      "nickname": "",
      "osid": "N00009888",
      "pvsid": "15691",
      "sortname": "Alexander, Lamar (Sen.) [R-TN]",
      "twitterid": "SenAlexander",
      "youtubeid": "lamaralexander"
    },
    "phone": "202-224-4944",
    "role_type": "senator",
    "role_type_label": "Senator",
    "senator_class": "class2",
    "senator_class_label": "Class 2",
    "senator_rank": "senior",
    "senator_rank_label": "Senior",
    "startdate": "2015-01-06",
    "state": "TN",
    "title": "Sen.",
    "title_long": "Senator",
    "website": "https://www.alexander.senate.gov/public"
  },//end of single json array object
  {
    "caucus": null,
    "congress_numbers": [
      114,
      115,
      116
    ],  
"current": true,
    "description": "Senior Senator for Maine",
    "district": null,....same repetition of structure

ser函数应将服务器中存在的整个JSON数组提供给formdt []，然后对其进行迭代并获取每个对象并转换为JSON，然后将bioguide推入id数组，从输入中搜索id并与每个JSON嵌套值匹配数组中的对象没有任何反应会导致控制台出现错误：

_this.formdt在第37行(this.fdts.getdt().subscribe(dt=>this.formdt.push=dt))上未定义

Answer 1

给出的错误非常明显：this.formdt未定义。

您已声明属性类型，但尚未初始化。

因此将formdt:string[]替换为formdt:string[] = []

从Observable获取json数组值并将数据提供给前端

1 个答案: