我的用戶資料以html形式出現，但html頁面不顯示用戶資料

我試圖在某些人打開用戶頁面時執行此操作，人員將看到用戶詳細資訊，但此 html 頁面無法像這樣作業。用戶詳細資訊正在資料庫中進入 html 頁面，如名字、id 或電子郵件，但當我試圖查看這些資料時，我看不到

我越來越喜歡這張照片

但我想看到這樣

這是我的 html 代碼

<div *ngIf="dataLoaded==false" class="spinner-border text-primary" role="status">
  <span class="visually-hidden">Loading...</span>
</div>

 


<table *ngIf="dataLoaded==true" class="table">
  <thead>
    <tr>
      <th scope="col">Email</th>
      <th scope="col">Id</th>
      <th scope="col">Ad?</th>
      <th scope="col">Soyad?</th>
       
       
     
    </tr>
  </thead>
  <tbody>
 
    <tr *ngFor="let user of users ;">
      
      <td>{{ user.Email }}</td>
      <td>{{ user.Id }}</td> 
      <td>{{ user.FirstName }}</td>
      <td>{{ user.LastName }}</td>
      
     
    </tr>
  </tbody>
   
  


</table>

這是我的打字稿代碼

import { Component, OnInit } from "@angular/core";
 import { Users } from "src/app/models/Users";
import { AuthService } from "src/app/services/auth.service";
import { ActivatedRoute } from '@angular/router';
import { ToastrService } from 'ngx-toastr';
 
 

 

@Component({
  selector: 'app-users',
  templateUrl: './users.component.html',
  styleUrls: ['./users.component.css'],
})
export class UsersComponent implements OnInit {
  user: Users   ;
  users : Users[] = []
  dataLoaded = false;
 

  constructor(private authservice: AuthService,
    private activatedRoute :ActivatedRoute, private toastrService:ToastrService
   ) {}

    
  ngOnInit(): void {
    this.activatedRoute.params.subscribe(params=>{
      if(params["Id"]){
        this.GetUserById(params["Id"])
      }else{
        this.getusers()
      }
    })
}



  getusers() {
    this.authservice.getusers().subscribe(response=>{
      this.users = response.data
      console.log(this.users)
      this.dataLoaded = true;
    })   
  }

  GetUserById(Id:number) {
    this.authservice.GetUserById(Id).subscribe(response=>{
      this.user= response.data
      this.dataLoaded = true;
      console.log(this.users)
 
    })   
  }
  

}

這是我的控制臺日志

[webpack-dev-server] Live Reloading enabled. index.js:551
Array [ {…}, {…} ]
?
0: Object { id: 3002, firstName: "striasd", lastName: "stringwww", … }
??
email: "[email protected]"
??
firstName: "striasd"
??
id: 3002



lastName: "stringwww"


 ??
status: true
??
<prototype>: Object { … }
?

1: Object { id: 4002, firstName: "stringq", lastName: "stringq", … }
?
length: 2
?
<prototype>: Array []

這是我的 html 控制臺影像

那我該怎么辦或者我的錯是什么

uj5u.com熱心網友回復：

您正在使用大寫字母來呈現資料，但您的資料引數是小寫字母，我希望這是問題所在。

<tr *ngFor="let user of users ;">
     
     <td>{{ user.email }}</td>
     <td>{{ user.id }}</td> 
     <td>{{ user.firstName }}</td>
     <td>{{ user.lastName }}</td>
   </tr>

uj5u.com熱心網友回復：

 <tr *ngFor="let user of users.user">
  
  <td>{{ user.email }}</td>
  <td>{{ user.id }}</td> 
  <td>{{ user.firstName }}</td>
  <td>{{ user.lastName }}</td>

</tr>

希望這可能有效。

標籤：javascript 打字稿 视觉工作室代码

上一篇：wsl.exe在eclipse本地終端自定義條目中總是出現多次

下一篇：如何使用VS代碼構造html代碼？