当我使用angular 9 ngFor时，数组不显示相应的数据
当您使用Angular 9的ngFor指令时，如果数组中的数据没有正确显示，可能有以下几个原因：
- 数据源问题：首先，请确保您的数据源是正确的，并且包含了您期望显示的数据。您可以在组件中检查数据源是否正确加载，并且在模板中使用插值表达式（例如{{data}}）来验证数据是否正确传递到模板中。
- 数据绑定问题：确保您正确地将数据绑定到ngFor指令中。ngFor指令需要一个可迭代的对象作为输入，并使用特定的语法来循环遍历该对象。例如，如果您的数据源是一个数组，您可以使用以下语法来绑定数据：
- 数据绑定问题：确保您正确地将数据绑定到ngFor指令中。ngFor指令需要一个可迭代的对象作为输入，并使用特定的语法来循环遍历该对象。例如，如果您的数据源是一个数组，您可以使用以下语法来绑定数据：
- 这将循环遍历名为items的数组，并将每个元素显示在一个div中。
- 上下文问题：确保您在正确的上下文中使用ngFor指令。ngFor指令需要在正确的组件或模板中使用，并且在正确的位置。请确保您将ngFor指令应用于包含数据的元素或组件上。
- 错误处理：如果以上步骤都没有解决问题，您可以在浏览器的开发者工具中查看控制台，以查看是否有任何与ngFor相关的错误消息。这些错误消息可能会提供有关问题的更多详细信息，帮助您解决问题。
总结起来，当您使用Angular 9的ngFor指令时，如果数组不显示相应的数据，您应该检查数据源、数据绑定、上下文和错误处理等方面，以确定问题所在。如果问题仍然存在，请参考Angular官方文档或寻求相关技术社区的帮助来解决问题。
腾讯云相关产品和产品介绍链接地址：
- 腾讯云官网：https://cloud.tencent.com/
- 云服务器（CVM）：https://cloud.tencent.com/product/cvm
- 云数据库 MySQL 版：https://cloud.tencent.com/product/cdb_mysql
- 人工智能平台（AI Lab）：https://cloud.tencent.com/product/ailab
- 云存储（COS）：https://cloud.tencent.com/product/cos
- 区块链服务（Tencent Blockchain as a Service）：https://cloud.tencent.com/product/tbaas
- 腾讯云元宇宙解决方案：https://cloud.tencent.com/solution/metaverse
相关·内容
1回答
当我使用angular 9 ngFor时，数组不显示相应的数据
node.js、angular、mongodb
我是一个使用angular的新手。在创建博客项目时，我需要显示文章的所有标签；当我使用ngFor时，它没有任何效果。我希望每个人都能帮助我看看我写的东西有没有问题。", "@angular/core"
浏览 28提问于2020-03-11得票数 0
回答已采纳
1回答
将一个项目悬停以显示特定于它的div。
angular、typescript、angular6
我正在使用*ngFor循环&在deals数组中显示项 </div>
我想要实现的是，当我在html中悬停div card时，将显示相应的di
浏览 0提问于2018-09-30得票数 3
回答已采纳
1回答
Angular中的mat-list不显示任何名称
angular、angular-material
我有一个组件，它生成一个列表，其中包含数组中某些值的名称。问题是:即使数组中有20个值，列表也不会显示任何内容。void {HTML： <mat-list>
<mat-list-item *ngFor
浏览 0提问于2021-10-15得票数 0
1回答
NgFor在Angular2中的滤波
angular、angular2-template
我想显示数组的一些元素。在使用管道过滤数组时，更新数组不会在DOM中得到反映，如下代码所示。import {Component} from 'angular2/core'
@Pipe({name="#n of numbers | myPipe">{
浏览 1提问于2016-02-01得票数 2
回答已采纳
3回答
使用NgFor在angular2中生成子组件不起作用
angular
我用的是angular2 alpha 37。按如下方式定义<map>视图时(显式列出所有数组成员的组件)： templa
浏览 3提问于2015-10-02得票数 6
1回答
angular2 rc5升级，在mongo游标上迭代失败
mongodb、angular、angular-meteor、angular2-rc5
我正在写一个meteor/angular2应用程序，我刚刚升级到rc5。当我试图根据我的组件中的mongo光标显示消息列表时，我得到了一个错误。Mongo.Collection<string>(null); }下面是html模板： <li *ngFor="let message of messages&
浏览 7提问于2016-09-13得票数 0
2回答
将从rxjs " from“运算符获取的对象的可观测值转换为数组的可观测值
angular、rxjs
在迭代可观察对象时，我遇到了这个错误。我知道它正在考虑将getNumbers方法的返回值作为对象而不是数组。但是，我不希望处理数据并创建数组，然后将其传递给视图。我希望它是可观察的数字数组，并使用此数组与ngFor和异步来显示每个元素。请让我知道如何实现这一点。以下是代码 import { Injectable } from '@angular/
浏览 20提问于2019-07-03得票数 0
回答已采纳
1回答
当输入数据更改时，Angular 2视图不会更新
angular
我有一个Angular 2应用程序，其中包含一个消息提要，它是一个IMessage类型的数组。在OnInit事件中，从服务器检索并显示消息。到目前一切尚好。当我使用this.messagea.unshift(newMessage);更新IMessage数组时，视图不显示新消息。当我遍历相同的数组时，我可以看到新消息在数组中，刷新页面(并从
浏览 1提问于2017-07-20得票数 0
3回答
在angular 5中，对象数组的类型返回object。如何解决这个问题？
javascript、angular
这是我在getOriginData(this.encodedData)内的code.Here中使用的函数，我调用了相应的API来获得响应。custom-select customArrow"> <option *ngFor，如下图所示，清晰地显示为一个对象
浏览 1提问于2019-03-13得票数 0
2回答
如何使用Angular数据绑定来输出嵌套数据？
javascript、angular、typescript、data-binding
我将有多个时隙，每个都有多个窗口。我理解数据绑定的基本概念，但似乎无法使其与嵌套数组一起工作。我尝试了几种方法，但都没有用。不知道我做错了什么。isOpen: true { to: "9:maxAvailability: 80, },
浏览 1提问于2021-02-18得票数 0
1回答
从mongodb取回数据到angular
html、arrays、angular、mongodb
我试图从mongodb获取所有数据，但它显示[object] [object]如何从mongodb获取数组数据到angular？下面是我的代码： import { Component, OnInit } from '@angular/core'; title:string;
description:
浏览 8提问于2021-04-29得票数 0
回答已采纳
1回答
调用array.sort()时，Angular未检测到更改
node.js、angular、typescript、angular8、angular9
我有一个使用"*ngFor“循环显示的对象数组，当我调用array.sort()时，数组内部发生了变化，元素的位置/顺序也发生了变化，但angular没有检测到这些变化，也没有重新触发"ngFor”循环如何在调用排序函数后更新我的UI。
浏览 13提问于2020-04-11得票数 1
3回答
angular 2中的双向绑定数组
angular、angular2-directives
我知道在angular 2中有基本的双向绑定，如文档所示。我有一个persons数组，我用它来构建一个html列表： <form> <input}}</div>
<div class='col'>{{person.job}}</div>
浏览 4提问于2016-10-03得票数 9
3回答
无法在angular6中循环对象数组
arrays、angular、typescript、observable、angular6
我试图从omdbapi中获取电影数据，但是我无法在html中打印这个值。.tsimport { HttpClient } from '@angular/common/http'
浏览 1提问于2018-09-18得票数 0
回答已采纳
1回答
在angular模板中迭代非空数组时结果为空
javascript、angular、typescript
编辑:我对push方法进行了更改，但仍然不起作用，我向api发出get请求，并将每个响应推送到一个数组。阵列在登录到控制台时可见。在打印时，模板长度中的数组长度为5。但是当我尝试使用ngFor遍历它时，没有显示任何输出import { Injectable } from '@angular/core';
import { HttpClient } fromefa
浏览 19提问于2021-05-25得票数 0
2回答
Angular 6:在*ngFor-dynamically-generated-template-elements上使事件具有同等的动态性
html、angular、typescript、ngfor
通常在Angular中，为了显示和隐藏内容，我在组件中创建了一个变量，在切换该变量的元素上创建了一个mouseover-mouseout事件，并在希望该事件影响的任何元素上放置了一个ngIf (显示/隐藏但是，如果模板在ngFor中，则不能这样处理。当您将鼠标悬停在任何动态生成的元素上时，它将触发所有显示/隐藏。因此，我的问题是，使用Angular star指令
浏览 20提问于2018-08-18得票数 1
回答已采纳
4回答
无法在角+ Spring启动项目中使用*ngFor显示元素列表
java、angular、spring、list、spring-boot
Delete Test</th> </thead> <tr *ngForselect * from test"); }
它正确地获取列表中条目的编号，但无法显示结果当我使
浏览 6提问于2020-08-28得票数 1
回答已采纳
6回答
如何使用NgFor而不创建数组来生成矩阵用户界面模式
javascript、html、angular、typescript、angular2-template
通过接收输入参数，它应该决定什么是UI矩阵模式维度:例如9X3元素：import {Component, Input, OnInit} from 'angular2/core'; if (this.cardType === 3) {
浏览 13提问于2016-04-14得票数 7
2回答
Angular中FormArray的自定义验证器运行次数过多
angular、angular-reactive-forms
在Angular 6中，我使用FormBuilder创建了如下表单： formData = this.formBuilder.group({
name: new FormControl('', Validators.required
浏览 13提问于2019-05-24得票数 0
扫码
添加站长 进交流群
领取专属 10元无门槛券
手把手带您无忧上云
相关资讯
热门标签
云服务器
ICP备案
实时音视频
对象存储
即时通信 IM活动推荐
腾讯云开发者
