Question

如果我能看到网站上的价值，为什么会收到错误？...出了什么问题？

这是代码，基本上，它正在工作但在控制台中出现错误

students.component.html

 <li class="list-inline-item">
    <figure>  
       <img [src]="car.details.type.icon">
           <figcaption class="whiptype__value">{{ car.details.type.name }}</figcaption>
           </figure>
 </li>

students.service.ts

get(): Observable<string[]> {
    return this.http.get('assets/data/cars.json')
      .map((res: Response) => res.json())
                   // .do(data => console.log('server data:', data))  // debug
      .catch(this.handleError);
  }

  getById(id: string): Observable<string[]> {
    return this.get().map(
      (res) => {
        let filterResult =  res.filter(item => {           
          return item.id === id 
        });
         // console.log(filterResult[0]);

        return filterResult[0];
      }).catch(this.handleError);
  }

students.component.ts

getStudentById (id:number){
    this.studentService.getById(id)
      .subscribe(
        student => this.student = student,
        error => this.errorMessage = <any>error
      );
  }

这是数据的返回方式 json回复

{id: "3", details:{ type:{ name: "ferrari", icon: "assets/icons/car-details/ferrari.png"  }}}

Answer 1

在此处使用安全导航操作符，因为您在接收数据之前尝试访问它

<figure>  
 <img [src]="car?.details?.type?.icon">
 <figcaption class="whiptype__value">{{ car?.details?.type?.name }}</figcaption>
 </figure>

为什么我得到“无法读取属性'类型'未定义”并显示？

1 个答案: