Angular 获取响应数据?

这是 console.log(res) 结果
image.png

但是直接 res.data 会报错, 因为在编译期间认为res下没有data
image.png

想问一下我要怎么取到里面的data?

当前请求的核心代码如下

employee.service.ts

export class EmployeeService {

  apiUrl: string = 'http://localhost:8080/employee';

  constructor(private httpClient: HttpClient) { }

  list() {
      return this.httpClient.get(this.apiUrl + '/list');
  }

}

employee.component.ts

ngOnInit(): void {
  this.employeeService.list().subscribe(res => {
    console.log(res);
  })
}

EmployeeController.java

@RestController
@RequestMapping("/employee")
public class EmployeeController {

    @Autowired
    private EmployeeService employeeService;

    @GetMapping("/list")
    public Map<String, Object> list() {
        Map<String, Object> result = new HashMap<>();
        List<Employee> data = employeeService.list();
        result.put("msg", "success");
        result.put("data", data);
        return result;
    }

}
回复
阅读 828
4 个回答

接口是没问题的,是你的服务方法没有指明返回类型所以给了你属性错误提示

service里

list() {

  return this.httpClient.get<{data:any[];msg:string}>(this.apiUrl + '/list');

}

或者component里

.list().subscribe((res:any)=> res.data …)

第一种,使用any

this.employeeService.list().subscribe((res: any) => {
    console.log(res.data);
})

第二种,指定返回值类型

interface ServiceResponse {
    data: '你的数据'
}
this.employeeService.list().subscribe((res: ServiceResponse) => {
    console.log(res.data);
})

  list(): Observable<{data: any[], msg: string}> {
      return this.httpClient.get<{data: any[], msg: string}>(this.apiUrl + '/list');
  }

data改成any属性或者写一个data的interface结构

俗称 anysctipt

撰写回答
你尚未登录,登录后可以
  • 和开发者交流问题的细节
  • 关注并接收问题和回答的更新提醒
  • 参与内容的编辑和改进,让解决方法与时俱进
推荐问题