angular和for循环实现listview列表_anglur 列表循环

说明：用div+ts实现一个listview的列表

icon：

step1:

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

@Component({
   
  selector: 'app-root',
  templateUrl: './app.component.html',
  styleUrls: ['./app.component.css']
})
export class AppComponent implements OnInit {
   
  map = new Map();
  messages = new Array()

  ngOnInit(): void {
   
    this.map.set(0, new Student(0,"http://www.gov.cn/xinwen/2022-06/26/5697838/images/b63857995c49409cb6478096e79af02e.jpg"
      , "神级富豪", "了无忧", "都市"
      , "连载", "拜金女友让我父母睡大街？一怒拒绝，却意外绑定人生巅峰系统。恭喜宿主获得一个亿。恭喜宿主获得两亿豪车兰博基尼爵逸铭风一辆。恭喜宿主成为百亿市值公司董事长。走上了人生巅峰的陆逸，默默感叹：我不喜欢钱，我对钱真的没兴趣了。",
      "第51章 神秘电话", "08-12 07：02", "76942"
    ));

    this.map.set(1, new Student(1,"http://www.gov.cn/xinwen/2022-06/26/5697838/images/60e5bbc1a8ab4bdbab699e56ecc490ce.jpg"
      , "我的极品朋友", "锦猪", "言情"
      , "完结", "农家小子闯入红尘以后，将会有何作为？遇木则兴，遇水则争，遇强则屈，遇土则活，成大器者，必经重重磨难。何意？何解？",
      "第155章 龙王殿下", "08-12 07：25", "82942"
    ));

    this.map.forEach((value, key, map) => {
   
      this.messages[key] = value
    })

    console.log(this.messages)

    console.log(this.map)
  }
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39