Angular 类型typescript上不存在属性

我编译应用程序时遇到以下类型的错误：

rc/app/admin/users/users.component.html:22:27-错误TS2339:Property “UsersComponent”类型上不存在“getUsers”

22显示用户C

src/app/admin/users/users.component.ts:7:16

7 templateUrl:“./users.component.html”

组件UsersComponent的模板中出错

Usercomponent.html

    <h1>Users Admin</h1>
    <div class="container row">
        <div   class="col-md-6">
        <table class="table">
          <thead>
          <tr>
            <th>ID</th>
            <th>Name</th>
            <th></th>
          </tr>
          </thead>
          <tbody>
          <tr *ngFor="let user of users" >
            <td>{{user.id}}</td>
            <td>{{user.name}}</td>
            <td><button type="button" (click)="getUsers()" class="btn btn-sucess">Show Details</button></td>
          </tr>
          </tbody>
        </table>
      </div>
      <div   class="col-md-6">
             <button (click)="getUsers()" mat-button-sucess>Display Userc</button>
      </div>
    </div>

httpclientservice.ts

    import { Injectable } from '@angular/core';
    import { HttpClient } from '@angular/common/http';
    import { User } from '../model/User';
    
    @Injectable({
      providedIn: 'root'
    })
    export class HttpclientService {
    
      constructor(private httpClient:HttpClient) { }
    
      getUsers()
         {
              return this.httpClient.get<User[]>('http://localhost:8080/users');
          }
    }

usercomponent.ts

    import { Component, OnInit } from '@angular/core';
    import { User } from '../../model/User';
    import { HttpclientService } from '../../service/httpclient.service';
    
    @Component({
      selector: 'app-users',
      templateUrl: './users.component.html',
      styleUrls: ['./users.component.css']
    })
    export class UsersComponent implements OnInit {
         users: Array<User>
    
      constructor(private httpclientService: HttpclientService) { }
    
      ngOnInit() {
          this.httpclientService.getUsers().subscribe(
                  response => this.handleSuccessfulResponse(response),
                );
      }
      handleSuccessfulResponse(response) {
            this.users = response;
          }
    
    }

您需要在usercomponent.ts文件中创建getUsers

如果需要将getUser运行到ngOnInit中？然后尝试以下方法

import { Component, OnInit } from "@angular/core";
import { User } from "../../model/User";
import { HttpclientService } from "../../service/httpclient.service";

@Component({
  selector: "app-users",
  templateUrl: "./users.component.html",
  styleUrls: ["./users.component.css"]
})
export class UsersComponent implements OnInit {
  users: Array<User>;

  constructor(private httpclientService: HttpclientService) {}

  ngOnInit() {
    this.getUsers();
  }

  getUser() {
    this.httpclientService
      .getUsers()
      .subscribe(response => this.handleSuccessfulResponse(response));
  }
  handleSuccessfulResponse(response) {
    this.users = response;
  }
}

---

此错误是由于您未在适当的.ts文件中定义getUser而导致的

getUsers是HttpclientService的一部分，而不是UsersComponent的一部分，您在其模板中调用它。您没有向我们展示的UsersComponent.ts是否有getUsers方法？您的操作处理程序位于组件UsersComponent.ts中；组件调用service.look my usercomponent.ts文件，正如预期的那样，那里缺少getUsers。@lipudalai-Tharindu Lakshan给了您很好的建议，并且给出了一个非常清晰的示例。请考虑向上箭头图标，并在他的帮助下接受复选图标图标。