问题标签 [ngfor]

For questions regarding programming in ECMAScript (JavaScript/JS) and its various dialects/implementations (excluding ActionScript). Note JavaScript is NOT the same as Java! Please include all relevant tags on your question; e.g., [node.js], [jquery], [json], [reactjs], [angular], [ember.js], [vue.js], [typescript], [svelte], etc.

0 投票
1 回答
4333 浏览

html - Angular2 IndexOf 查找和删除数组值

您好,我正在尝试在使用 Angular2 和 Typescript 时删除数组中的某个索引。我想从值中检索索引。

我的数组被正常声明...

我从设置删除功能的基本前提开始。

我的 JSON.Stringify 的 console.log 告诉我,我将尝试删除的值是“第六个属性”。但是,当我尝试使用以下代码在我的数组中查找此值时。它返回 -1,这意味着在数组中找不到我的值。

在我到控制台的输出中,它确实返回了要搜索的项目,但没有在数组中找到该项目

我的搜索数组的函数的实现有问题吗?

0 投票
1 回答
1994 浏览

angular - NgFor 是否支持包含一个对象的数组

我正在尝试使用 Angular2 的 NgFor 动态创建一些 HTML。

我似乎遇到的问题是,每当我有一个包含一个对象的数组时。

我得到的错误如下:

下面是一个典型的 JSON 对象(它是数组中的许多对象之一),我指的是...

该对象正确渲染。它所指的第一个孩子如下:

这个对象只有一个孩子,这就是问题所在......

我在每个组件中使用相同的脚本来渲染孩子;第一个实例中的脚本可以正常工作,因为有多个孩子,但是在第二个实例中,它会因上述错误而崩溃。

我用于为这两个实例创建子级的脚本如下:

而相关的ts文件如下:

如何让此脚本与仅包含一个子引用的对象一起使用?

0 投票
1 回答
1741 浏览

angular - 列出模板表角度2中的选定文件

我是 Angular 2 的新手。试图在从浏览器中选择的模板表中列出文件名。下面是我的代码


模板.html


组件.ts


如果我尝试应用 *ngFor,我会收到以下错误

错误


有人能说出错误和解决方案吗?谢谢

0 投票
1 回答
2224 浏览

angular - Angular 2 ngFor 不更新数据

我有组件。

另外,这是我在服务中的数据

当我在这个数组中添加新元素时

列表不更新。问题是什么?

0 投票
3 回答
14479 浏览

angular - Angular2选择的选项与对象

我有一个与客户打交道的 Angular 2 应用程序和一个弹簧支架后端。客户对象有一个客户类型,这也是一个对象,我在客户表单上的下拉菜单工作,以便将对象存储为值,但是我不知道如何选择正确的客户类型时现有客户已加载到表单中。

在上面的代码片段中,如果客户已经有一个客户类型,那么下拉菜单不会选择任何值。我记得使用 ngOptions 解决了与 angular1 相同的问题:

所以,我的问题是,如何复制 Angular1 在 Angular 2 中解决这个问题的方式

0 投票
2 回答
2018 浏览

indexing - Angular2 *ngFor 将索引设置为同一标签内的属性

我试图创建一个引导轮播。所以我使用 *ngFor 添加元素和轮播指示器。(小圆圈表示当前位置)

我通过 [class.active]="idx​​ === 0" 设置活动类条目,它工作正常。但是,当我尝试设置 data-slide-to="idx​​" 时,结果不是想要的索引为数字,而是字符串“idx”。

知道如何分配索引值吗?

0 投票
2 回答
7789 浏览

html - 如何在 Angular2 中使用 *ngFor 动态生成 ngModel?

这两天以来一直让我感到困惑,如何ngModel在循环中为每个新迭代都有一个新的*ngFor?这个想法是我加载一个问题列表,在每个问题中我有 2 个命题,这里是 html

只有当你有一个问题时,这才会顺利进行listQuestion,如果有多个问题,一旦我检查第一个问题的一个proposition(例如lpo[0]:),所有其他第一个命题(首先是因为其他问题的索引lpo = 0)将被选中 这是一张说明问题的图片:

在此处输入图像描述

请问有什么帮助吗?

0 投票
1 回答
4782 浏览

angular - 如何在 *ngFor 数组中显示/隐藏元素,而不触及该数组?

1.你好。有很多关于如何显示/隐藏元素的答案,为迭代数组的每个元素附加一个我们在真/假时更改的属性。

所以每次我们列出数组的每个元素时,它都会创建 item.showSubItem 属性。在这种情况下,我们的数组已更改。

但是,如果我想显示/隐藏这些项目,但不编辑主数组,该怎么办。这很重要,因为我在开始时检查了这个数组是否相等。有创建与数组无关的 var 的答案,但是如何为每个元素创建 var 以分别显示/隐藏每个元素?

更新:

ts文件:

更新2:

我在 home.ts 中用 i=false 初始化了数组:

在我将它发送到子组件之后,在 html 中:

比我尝试使用 showSubItems[idx] 查看项目。

但它显示错误:

TypeError:无法读取未定义的属性“0”

但是当我渲染所有{{showSubItems}}数组时,它显示false,false,false没有问题。

看起来idx价值还没有准备好进行第二次迭代。抱歉不能使用 plunker(正在处理它)。

0 投票
1 回答
169 浏览

angular - 在 ngFor 上循环绑定 @input - 未正确更新

我有一个带有两个绑定输入的组件(一个大数组和数组的两个标记(位置))。

零件:

看法

我正在循环绑定数据@input 并使用@input 标记(position.start 和 position.end)来切片只需要的元素(标记可以随时更改)。

当 info.data 循环时其中一个标记发生变化时,有时结果会混乱。

有时,在标记(position.start 或 position.stop)发生变化后会处理一次(或两次)迭代。

更新 component.start 后迭代应该从 i:0 到 i:14

在此处输入图像描述

0 投票
6 回答
31162 浏览

javascript - Angular 2 *ngFor 不工作

以下是我的组件:

尝试加载组件时出现以下错误:

另外,我不确定在导入组件时是否应该使用“@angular/core”或“angular2/core”。