问题标签 [ng-template]

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 回答
840 浏览

angular - Angular 4如何从ng-template中的方法调用填充变量

我正在创建一个日历组件,它为给定日期构建日历(月视图)。我创建了一个自定义 ng-template 以传递给日历控件,因此我可以根据从服务调用返回的数据在日历中为每一天注入自定义内容。这是我的代码:

一旦我的inventoryService 流将来自服务器的值填充到名为“InventoryList”的变量中,我就有一个部分显示。在我的自定义 ng-template (#myCustomDayTemplate) 中,我根据 app-calendar 中的处理将“day”变量传递到此模板中。在我的自定义模板中,我调用 getValueByDay 来查看给定日期的 InventoryList 并显示库存计数。这一切正常,但如果库存值为 0,我需要能够更改显示在 UI 上的库存值的样式。

我可以通过调用 getValueByDay 两次来实现这一点(一次将值显示到 UI,一次确定 ngClass''no-inventory')。是否可以调用一次 getValueByDay 并将答案放入变量中,然后在 UI 中使用该变量以及确定 ngClass''no-inventory'?

谢谢你的帮助。

0 投票
0 回答
183 浏览

angularjs - 语法高亮文本/ng-template Intellij

Intellij (v2017.3) 无法将该标记识别<script "text/ng-template">为 Angularjs 模板片段。

也许是因为我在 scala 视图中?

我尝试按照此处所述添加自定义语言注入,但它不起作用...

我的 angularjs 插件已正确启用...我不知道在哪里看。

你有想法吗 ?

0 投票
2 回答
3163 浏览

angular - 正在加载多次

我正在使用 ngTemplateOutlet 来加载 . 但它多次加载模板。它正在加载正确的模板,但它执行多次 loadTemplate() 方法。

HTML中:

在我的component.ts中:

0 投票
5 回答
12219 浏览

angular - 将 ngFor 变量传递给 ngIf 模板

如果使用带有 then/else 语法的模板,如何将 ngFor 循环中的当前变量传递给 ngIf?

看起来它们在内联使用时可以通过,但不能从模板访问,例如:

模板似乎根本无法访问number,但如果内联使用它就可以工作。

以下链接中的工作和不工作版本的完整示例:plunkr

0 投票
3 回答
752 浏览

angular - 如何在组件 B 中渲染组件 A 的一部分

我有一个组件AB

组件B不包含组件A或方式

我试图换<div class="A1"></div>ng-template,然后componentB我正在查询它,但它总是undefined

@ViewChild('templ') templ: TemplateRef<any>;

然后我意识到这@ViewChild是查询子组件,那么您将如何查询和渲染<ng-template>它不是子组件?

0 投票
0 回答
725 浏览

javascript - 将一个组件中定义的 ng-template 传递给另一个组件?

是否可以在一个组件的模板中使用定义在另一个组件中的 ng-template?传递 ng-template 的名称

0 投票
1 回答
5080 浏览

angular - 如何使用 Angular (5) ng-template 实现加载微调器?

我有一个结帐页面,用户必须先登录才能继续。用户已经可以登录。在每种情况下,我都想在组件检测到用户是否登录时显示一个微调器。

check-out.html 代码如下所示:

我的签出组件看起来像:

但是总是显示(和),但我只想加载微调器,然后加载#guest 或#authenticated。如何实现?

如果搜索了很多,但发现 ngIf 只能采用 if-else 构造。

0 投票
2 回答
2301 浏览

angular - Angular,为 ng-template 使用外部模板

假设我在组件模板中有这样的代码:

<div *ngIf="user?.name; else dash-template">{{user?.name}}</div>

这在另一个组件模板中:

<div *ngIf="data?.datum; else dash-template">{{data?.datum}}</div>

在这两种情况下,如果没有 data,我想用 ng-template 中包含的模板(dash-template)替换我的 div。现在我可以通过在两个文件中添加 dash-template 来归档它。

破折号模板代码:

但是,一旦我决定更改 dash-template 的内容,我将需要更改每个文件中 dash-template 内容的每个实例。

我尝试在上层组件(app.component.html)中包含破折号模板,并使用外部 html 文件并将其与 index.html 中的链接标记一起包含: <head> ... <link rel="import" href="dash.template.html" > ... </head>

但在第一种情况下,我什么也没做:没有错误并且显示一个空字符串。在第二种情况下(带有链接标签),它找不到 html 文件。


我的问题是:

有没有办法定义一个可重用的 ng-template,或者更常见的是一个可重用的模板引用变量

这是处理空数据的正确方法吗?

0 投票
2 回答
77894 浏览

angular - Angular - ng-template 在 ngFor 内的 ngIf 内带有参数

我正在尝试构建此模板:

问题是链接变量在 ng-template 中是未定义的,所以我在访问未定义的“some_property”时遇到错误。

我正在努力了解如何将链接变量从 ngFor 传递到 ng-template

很高兴知道这个问题是否有多种解决方案。

0 投票
1 回答
697 浏览

angular - 访问 ng-template 的内容

有没有办法访问 ng-template 元素的原始内容。对于一个特殊的用例,我需要这个,我需要将模板的内容作为字符串打印到页面上以用于文档目的。

Angular 处理所有 ng 模板并在 DOM 中呈现占位符注释。

我需要访问“FOO”字符串