Angular 引入图片&循环数据和索引

阅读 48

2022-07-04

.ts

import { Component, OnInit } from '@angular/core';

@Component({
selector: 'app-home',
templateUrl: './home.component.html',
styleUrls: ['./home.component.scss']
})
export class HomeComponent implements OnInit {

public list:any[]=[
{
"player":'科比'
},
{
"player":'詹姆斯'
},
{
"player":'杜兰特'
}
]

constructor() { }

ngOnInit(): void {
}

}

.html

<h1>引入图片</h1>

<img src="assets/images/f2.png" alt="图片">
<hr>
<h1>循环数据 显示数据的索引</h1>
<ul>
<li *ngFor="let item of list;let key=index">
{{key}}--{{item.player}}
</li>
</ul>

Angular 引入图片&循环数据和索引_数据


精彩评论(0)

0 0 举报