问题标签 [ng-container]

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 投票
2 回答
2305 浏览

javascript - 将组件注入ng-container?(从文件中加载 ng-template)

我正在尝试在我的Angular应用程序中构建一个简单的选项卡菜单。

parant.component.html:

parant.component.ts:

这工作正常,只要<ng-template>是同一页面 html 上的一部分。现在我的页面(#template1#template2的内容)变得复杂,我想将它们移动到单独的组件中。

我怎么能将组件注入<ng-container>

0 投票
2 回答
1254 浏览

angular - Angular 8:如何在没有 html 标签的情况下使用 ngFor。我尝试了 ng-container 但它不起作用

在我遇到很多问题后,我创建了以下想法来填补我的 Angular 项目中的空白问题。下面显示的对象来自 API,我想像下面提到的那样循环它。我无法使用ng-container标签,而不是span因为它会创建折旧的 html 标签问题。原因是,我在数组中提到的标签不会在同一个对象中关闭,它将被命名为字段的给定数组的下一个对象的下一个或下一个对象关闭。我的意思是,如果第0th 订单有值<p>my text并且第1st 订单将有值is this </p>

以下代码有效

但是下面的代码给出了一些错误

在此处输入图像描述

这个循环的 JSON 响应是

任何人都请帮助我如何在没有标签的情况下使用它或如何使其ng-container工作

0 投票
1 回答
1276 浏览

angular - Angular - 如何将整个垫脚行移动到表格顶部

我正在使用带有 ng-container 的材料表,其中包含 3 件事:

a) th(mat-h​​eader-cell)
b) td(mat-cell)
c) td(mat-footer-cell)

在此表中,页脚行(前行中的数据总计)当前按预期显示在表的底部,但对于此业务案例,他们需要总计行(mat-footer-cell)显示在顶部。我应该如何处理这个?

这是表格的一个片段:

我尝试制作多个表头并将页脚分隔到它们自己的 ng 容器中,但这似乎非常多余并且无法正常工作。重新排列 trs 时它不起作用。因此,也许可能还有其他一些巧妙的方法来定义多个不带冗余的 mat-h​​eaders,或者简单地操纵当前的表结构来适应这一点,但这就是我的知识有限的地方。

所以总而言之,我需要将页脚行移到数据上方,它将位于当前标题列的正下方。

0 投票
0 回答
291 浏览

angular - ng-template 中的动态标记并与 ng-container *ngTemplateOutlet 一起使用

我有一个 *ngFor 遍历用户,例如:

我想创建这样的 ng 模板:

并在我项目的不同组件中像这样使用它们

所以,我的问题是,我可以动态地向 ng-template 声明标签吗?

0 投票
1 回答
165 浏览

angular - Angular 7 - ngTemplateOutlet 变量值(表达式)

我无法通过变量在我的 ng-container 中传递 *ngTemplateOutlet 的值。

app.component.ts

app.component.html

当然,如果我在下面定义,一切都会按预期进行

如何使 SingleSelect 成为变量值?

Stackblitz 供参考 - https://stackblitz.com/edit/angular-h4mgyq?file=src%2Fapp%2Fapp.component.html

0 投票
1 回答
602 浏览

angular - 如何将模板传递给Angular中的嵌套组件

我正在 NativeScript 和 Angular 中构建自动完成功能(这个问题也适用于纯 Angular)。

标记看起来像这样:

它将从外部使用:

如您所见,我想将自定义模板传递给 ListView 将使用的查找。我正在检索这样的模板

我可以通过定义在查找中毫无问题地渲染它

但是,当我尝试将其放入也需要模板的 LietView 时,我无法使其正常工作。我收到类似“错误:在列表模板中找不到合适的视图!嵌套级别:0' 任一项目都呈现为 [Object object]

我已经尝试了这些选项:

有人知道我如何实现这一点吗?

谢谢

0 投票
1 回答
615 浏览

angular - 角度 8:用于多视图子引用的单个 ng 容器

我的组件中有三个 viewchild 装饰器,如下所示:

这些的引用在我的 html 文件中提供,如下所示:

我想将所有三个容器合并为一个容器,并且 ng-container 应该只包含对最近更改的 viewchild 的引用。像这样的东西:

我怎样才能实现它?

0 投票
0 回答
89 浏览

angular - 角度下拉菜单更改其他下拉菜单

我有一种情况,当我选择下拉菜单时,它也会更改页面上其他下拉菜单中的值。

我试图找出导致问题的原因,我注意到如果我删除 ngFor 中的 trackBy,它就会消失。

不幸的是,我需要 trackBy 来提高性能。

任何线索为什么会发生这种情况?这是一个演示问题的堆栈闪电战:

https://stackblitz.com/edit/angular-27snjx

0 投票
2 回答
527 浏览

angular - 使用 ngTemplateOutlet 或其他方式在多个选项卡中重用 Angular ngb-tabs 的内容

我正在使用 Angular ng-tabset 来呈现一些选项卡。我的 ngb-tab 看起来有点像:

效果很好。但是我在这个模板中还有几个其他选项卡,我希望在其中呈现相同的内容。因此,出于可重用性的目的,我试图将选项卡的内容分开移动,并在我希望呈现的每个选项卡中使用它的引用。我不知道该怎么做。我试着把它放在一个单独<ng-template>的里面:

在我需要渲染的选项卡下,我尝试将其称为:

但是我的标签没有呈现。也许是错误的方法,或者我遗漏了一些东西。是否有可能实现我想要实现的目标?如果是,如何?

0 投票
0 回答
79 浏览

html - 为什么我的 html 表格中的表单输入无法点击?

我正在尝试在 html 中呈现一个表格,该表格是反应式表单数组的表示。

我遍历复杂对象(FormGroup > FormArray > FormGroup > FormArray),最终数组是我们想要以转换后的格式向 UI 表示的数据。(发生在函数 groupFormGroup() 中)

一切正常,数据正确转换和显示。

但是,现在我正在尝试将输入(不是 formControlName 输入)添加到表中,并且当它们加载时,它们会在我无法单击或更改其值的情况下加载。它们没有被禁用,只是无法点击。控制台中没有出现错误。

我试过的:

  1. 修改类名,使其不再是 class='form-control'
  2. 将输入的 z-index 提高到最前沿
  3. 使输入位置相对

这是代码:

以及生成表单组的代码: