我不知道如何根據角度路由中的 id 從服務中獲取資料，需要一些幫助
這是我的 account.service.ts
import { Observable } from "rxjs";
export class AccountsService {
accounts = [
{
id: 1,
name: 'Master Account',
age: 23,
status: 'active'
},
{
id: 2,
name: 'Testaccount',
age: 23,
status: 'inactive'
},
{
id: 3,
name: 'Hidden Account',
age: 23,
status: 'unknown'
}
];
}
getData(id: string) {
}
}
這是我的組件，在這部分中我可以獲取 id，但我不知道要從基于此 id 的服務中的陣列中獲取資料
import { Component, OnInit } from '@angular/core';
import { ActivatedRoute } from '@angular/router';
import { AccountsService } from 'src/app/account.service';
@Component({
selector: 'app-detail-card',
templateUrl: './detail-card.component.html',
styleUrls: ['./detail-card.component.css']
})
export class DetailCardComponent implements OnInit {
constructor(
private route:ActivatedRoute,
private accountService:AccountsService
) { }
ngOnInit(): void {
this.getData()
}
getData(){
const cardId = this.route.snapshot.paramMap.get('id');
}
}
uj5u.com熱心網友回復：
為您服務
getData(id: string) {
return this.accounts.find(x=> x.id == id)
}
并在您的組件中：
getData(){
const cardId = this.route.snapshot.paramMap.get('id');
const account = this.accountService.getData(cardId)
console.log(account)
}
在模板中渲染它
export class DetailCardComponent implements OnInit {
myaccount:any;
constructor(
private route:ActivatedRoute,
private accountService:AccountsService
) { }
ngOnInit(): void {
this.getData()
}
getData(){
const cardId = this.route.snapshot.paramMap.get('id');
this.myaccount = this.accountService.getData(cardId)
console.log(this.myaccount)
}
}
在你的模板里面：
<div >name is : {{myaccount?.name}} </div>
<div >age is : {{myaccount?.age}} </div>
uj5u.com熱心網友回復：
在getData(id: number)服務的方法里面放這樣的東西：
return this.accounts.find(acc => acc.id == id)
轉載請註明出處，本文鏈接：https://www.uj5u.com/net/409238.html
標籤：