angular-template 相关问题

将此标记用于与模板主题相关的角度问题，例如插值（{{...}}），模板表达式，模板语句，数据绑定......

动态添加样式标签到组件并重新封装样式（角度）

我正在研究 AngularJS 到 Angular 的升级，目前我们有一个混合应用程序，它与 webpack 捆绑在一起，而不仅仅是 Angular cli。这导致了我们没有遇到过的问题...

javascript css angular angular-template angular2viewencapsulation

回答 1 投票 0

使用 PrimeNG DataView 显示数据？

我正在使用 Angular17 开发一个个人项目，我想使用 PrimeNG 组件 DataView 显示数据库中的项目。到目前为止一切顺利，我在 app.module 和请求中进行了导入...

sql-server angular primeng angular-template primeng-table

回答 1 投票 0

为什么 Angular ^17 我的模块、服务等出现问题

也许它已经在主题中的某个地方了。但我找不到类似的问题。问题是为什么 Angular 找不到模块和服务。我通过“ng g”创作，看来...

angular typescript service module angular-template

回答 1 投票 0

是否可以使用角度插值来显示角度分量？

我有一个我依赖的 Angular 组件。这个组件有一个getData方法，那么在这个组件的模板中调用这个方法，并使用Angular interpolat显示结果...

angular angular-components string-interpolation angular-template

回答 1 投票 0

有没有办法在运行时渲染 Angular 模板？

我正在使用 Angular 16.0.3，我正在尝试制作一个接收模板字符串并在运行时渲染它的组件。模板字符串中可以包含 Angular 组件，并且可能会...

angular jit angular-template

回答 1 投票 0

从服务传递后，模板中未提供来自 Angular 服务的数据

使用 Django 创建 API 后端后，我尝试获取一个 Angular 组件来显示提供的数据，以创建所有获取的数据集的列表。我能够在 service.spec.ts run 中进行测试...

javascript angular angular-services angular-template

回答 1 投票 0

Angular 6 嵌套 FormGroup 模板验证

我的表单组结构如下所示（order.component.ts）： this.orderForm = this.formBuilder.group({ 客户：this.formBuilder.group({ 名称：[''，验证器.required]，电话: ['',

angular angular6 angular-template

回答 3 投票 0

在 Angular 中使用外部库中的 templateUrl

在我的 Angular 15 应用程序中，我有许多组件通过引用 TemplateUrl 中的相同模板文件来使用相同的模板。例如： @成分（{ 选择器：'app-my-comp'，模板网址：'...

angular angular-template angular-library

回答 1 投票 0

如何防止在 Angular 中的 HTML 元素后面打印空格？

我想输出一个格式化的名称字符串，其中姓氏以粗体显示。像这样：姓氏、名字在 Angular 中，我通常会在 HTML 模板中执行此操作： {{ 姓氏 |大写字母...

angular angular-template

回答 1 投票 0

如何仅使用 ng-container 制作 if-else Angular 模板？

我想在我的角度模板中做一个 if-else 语句。我是这样开始的： [...这是结果 1] 我想在我的角度模板中做一个 if-else 语句。我从那开始: <ng-container *ngIf="contributeur.deb; else newDeb" > [... HERE IS A RESULT 1] </ng-container> <ng-template #newDeb> [... HERE IS A RESULT 2] </ng-template> 我尝试只使用 ng-container : <ng-container *ngIf="contributeur.deb; else newDeb" > [... HERE IS A RESULT 1] </ng-container> <ng-container #newDeb> [... HERE IS A RESULT 2] </ng-container > 不幸的是，这不起作用。我有这个错误： ERROR TypeError: templateRef.createEmbeddedView is not a function at ViewContainerRef_.createEmbeddedView (eval at <anonymous> (vendor.bundle.js:11), <anonymous>:10200:52) at NgIf._updateView (eval at <anonymous> (vendor.bundle.js:96), <anonymous>:2013:45) at NgIf.set [as ngIfElse] (eval at <anonymous> (vendor.bundle.js:96), <anonymous>:1988:18) at updateProp (eval at <anonymous> (vendor.bundle.js:11), <anonymous>:11172:37) at checkAndUpdateDirectiveInline (eval at <anonymous> (vendor.bundle.js:11), <anonymous>:10873:19) at checkAndUpdateNodeInline (eval at <anonymous> (vendor.bundle.js:11), <anonymous>:12290:17) at checkAndUpdateNode (eval at <anonymous> (vendor.bundle.js:11), <anonymous>:12258:16) at debugCheckAndUpdateNode (eval at <anonymous> (vendor.bundle.js:11), <anonymous>:12887:59) at debugCheckDirectivesFn (eval at <anonymous> (vendor.bundle.js:11), <anonymous>:12828:13) at Object.eval [as updateDirectives] (ActionsButtons.html:5) 任何人都可以解释一下这段代码出了什么问题吗？ ngIf指令的代码期望传递对else分支的模板（TemplateRef）的引用，它将调用createEmbeddedView来显示嵌套内容。因此，尝试对 else 内容使用任何其他类型的元素是没有意义的 - 它就是行不通。不过，如果需要的话，您可以在 ng-container 内嵌套 ng-template 。这可能看起来不直观，但请记住，结构指令（即您用 * 调用的指令）在引擎盖下始终表示为 ng-template，无论它们附加哪种元素to - 这两段代码是相同的： <ng-container *ngIf="contributeur.deb; else newDeb" > ... </ng-container> <ng-template #newDeb> ... </ng-template> <ng-template [ngIf]="contributeur.deb; else newDeb"> <ng-container> ... </ng-container> </ng-template> <ng-template #newDeb> ... </ng-template> 我不喜欢 if then else 的标准 Angular 结构。然后我用 ngSwitch 找到了替代解决方案： <ng-container [ngSwitch]="isFirstChoice(foo) ? 1 : (isSecondChoice(foo) ? 2 : -1)"> <ng-container *ngSwitchCase="1"> ...first choice... </ng-container> <ng-container *ngSwitchCase="2"> ...second choice... </ng-container> <ng-container *ngSwitchDefault> ...another choice... </ng-container> </ng-container> 为了回答您的请求，我会使用这个： <ng-container [ngSwitch]="contributeur.deb && 'isDeb'"> <ng-container *ngSwitchCase="'isDeb'"> ...... </ng-container> <ng-container *ngSwitchDefault> ...... </ng-container> </ng-container> 值得一提的是，这个简单的替代方案可能比许多其他选项更具可读性。只需使用第二个 ng 容器，然后用感叹号“不”条件来创建 else 部分。 <ng-container *ngIf="contributeur.deb" > [... HERE IS A RESULT 1] </ng-container> <ng-container *ngIf="!contributeur.deb"> [... HERE IS A RESULT 2] </ng-container > 兄弟，所有答案都很好。在我看来，根据当前的 Angular 17，我们可以使用 @if(){} 或 @if(){} @else if(){}。使用这个之后，代码看起来更清晰，更具可读性。 @if(contributeur.deb){ [.....any code] } @else if(!contributeur.deb){ [.....any code] } 就这样。谢谢

angular if-statement angular-template

回答 4 投票 0

获取对象可能为“null”。在 Angular 模板文件中

在我的 Angular 应用程序中，我收到以下错误：对象可能为“空”。问题是我收到此错误不是因为某些打字稿代码，而是因为这个 html 模板：...

angular typescript angular-template

回答 6 投票 0

属性模板中的角度字符串插值

Angular 6 属性中字符串插值的最佳实践是什么？我有这个代码： Angular 6 属性中字符串插值的最佳实践是什么？我有这个代码： <div class="container" [ngStyle]="{'grid-template-rows': 'repeat(' + value + ', 1fr) [last-line]'}"> 我想使用类似 'repeat(${value})' 的东西，并带有反引号您可以尝试将功能移至您的组件并在那里使用反引号： calculateStyle(value: string): string { return `repeat(${value}, 1fr) [last-line]`; } 在模板中： <div class="container" [ngStyle]="{'grid-template-rows': calculateStyle(value)}"> 我来这里寻找问题的答案，虽然 Mauricio 根据有关在模板中使用方法的文章表达了意见，但我认为根据具体情况来看这很好。但是，我想根据模板中的逻辑构建一个字符串 - 就像问题所述。在我对版本 14+ 的测试中，可以使用双大括号进行连接。例如： <someComponent someProperty="{{someObj?.anotherProp}}{{someVar ? ' [TEST]' : null}}"> </someComponent> 请注意，您需要省略属性上的方括号。

javascript angular angular-template

回答 2 投票 0

如何在.ts而不是.html中实现复杂的[ngClass]计算？

我们的团队正在开发一个相当复杂的表单引擎，它有许多重要的节点，例如表单、容器、字段等。不用说，这些节点的类计算非常复杂 - 那么...

angular angular-template

回答 2 投票 0

在模板中计算角度 *ngIf 语句时触发的事件

如果我有以下情况： {{用户名}} 有没有办法在上面的 div finally 时执行代码

angular angular-ng-if angular-template

回答 2 投票 0

根据条件角材动态绑定matSuffix和matPrefix 9。

如何在angular 9材质设计中动态绑定mat-icon上的matSuffix和matPrefix？我不喜欢我的方式。他们有什么更好的方法吗？