Angular拉取API数据报错：void类型不存在subscribe属性咨询

触发Property 'subscribe' does not exist on type 'void'报错的核心原因是服务方法名和组件调用的方法名不匹配：

• 在product.service.ts的ProductService类中，你实际定义的拉取接口数据的方法名为users()，并没有声明名为books()的方法
• 在homecomponent.ts中，你调用的是this.bookData.books()，TypeScript找不到类中不存在的方法时，会默认将该方法的返回值推断为void类型，void类型不存在subscribe方法，因此抛出该类型错误。

统一服务定义和组件调用的方法名即可，两种修改方式二选一：

• 方式1：修改组件中的调用方法名
  将组件中调用的不存在的books()方法，改为服务中实际存在的users()方法，修改后构造函数代码如下：

  export class HomeComponent {
    public sort: string;
    public books: any ;
    constructor(private bookData:ProductService) 
    { 
      // 修正调用的方法名为服务中实际定义的users()
      this.bookData.users().subscribe((data) => {
        this.books = data;
      });
    }
  }
  

• 方式2：修改服务中的方法名（更贴合业务语义）
  如果你希望方法名和获取书籍数据的业务逻辑匹配，可以把服务中的方法名从users()改为books()，修改后服务对应代码如下：

  @Injectable({
    providedIn: 'root'
  })
  export class ProductService {
    
    public baseURL ='http://localhost:8080/getBooks'
  
    constructor(private http:HttpClient) { }
  
    // 修正方法名为组件中调用的books()，建议补充明确的返回类型增强类型安全
    books(): Observable<Product[]> {
      return this.http.get<Product[]>(this.baseURL);
    }
   
  }
  

额外优化建议：给服务的接口方法补充明确的泛型返回类型，不要依赖TS的隐式推断，可以避免很多类似的类型错误，也能在编写代码时获得更准确的类型提示。

内容的提问来源于stack exchange，提问作者Anvesh Kumar Deo