Angular 在 HTML 模板中使用 lodash

【问题标题】：Angular use lodash in HTML templateAngular 在 HTML 模板中使用 lodash
【发布时间】：2018-11-04 15:01:43
【问题描述】：

请问，谁能告诉我如何在 Angular HTML 模板文件中使用 Lodash？

我知道如何在组件的 TypeScript 文件中使用它，但在组件的 HTML 文件中不知道。

谢谢

PS 这不是 AngularJs: Have Underscore/Lodash/_ in the view template 的欺骗，因为这与 AngularJS 而不是 Angular 有关。

【问题讨论】：

【解决方案1】：

如果您在 TS 文件中导入模块，则可以将其分配给类的属性并在 HTML 中使用它而不会出现任何问题。

import * as _ from 'lodash';
...
export class YourClass {
  lodash = _;
  ...
}

<p> {{lodash.isEqual(1,1)}} </p>

【讨论】：

【解决方案2】：

import * as _ from 'lodash'

将_放入变量并在模板中使用它是一种解决方案。但是，如果您只想使用 lodash 中的一个功能，也许您可以拥有类似

import { isEqual } from 'lodash';

然后将 isEmpty lodash 函数放在一个变量中，而不是整个 lodash 库中。

【讨论】：

【解决方案3】：

import * as _ from "lodash";

@Component({
  ...
})
export class MyComp {
  this._ = _;
}

【讨论】：

【解决方案4】：

为了更好的优化，使用 lodash-es (npm install lodash-es --save-prod) 只导入需要的包：

import isString from 'lodash-es/isString';
...
export class MyComponent {
  isString = isString;
}

【讨论】：