Angular 10 NgPlural 指令
在本文中,我们将了解 Angular 10 中的 NgPlural 是什么以及如何使用它。
Angular10中的NgPlural 用于根据数值添加或删除 DOM 子树。
句法:
NgModule:NgPlural使用的模块是:
- 通用模块
选择器:
- [Ng复数]
方法:
- 创建一个要使用的 Angular 应用程序。
- 使用 NgPlural 不需要任何导入。
- 在 app.component.ts 中定义一个变量
- 在 app.component.html 中,在元素中使用带有 ngPlural case 指令的 ngPlural 以及要检查的条件。
- 使用 ng serve 为 Angular 应用程序提供服务以查看输出。
例子:
app.component.ts
import { Component, Inject } from '@angular/core';
import { PLATFORM_ID } from '@angular/core';
import { isPlatformWorkerApp } from '@angular/common';
@Component({
selector: 'app-root',
templateUrl: './app.component.html',
styleUrls: [ './app.component.css' ]
})
export class AppComponent {
val = 1;
}
app.component.html
Geek
Geeks
app.component.html
Geek
Geeks
输出:
Geek
参考: https://angular.io/api/common/NgPlural