Angular在HTML模板中使用lodash

Question

请问，有人可以告诉我如何在Angular HTML模板文件中使用Lodash吗？

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

由于

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

Answer 1

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

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

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

Answer 2

import * as _ from "lodash";

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

Answer 3

import * as _ from 'lodash' 

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

import { isEqual } from 'lodash';

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

Answer 4

为获得更好的优化效果，请使用lodash-es（npm install lodash-es --save-prod）仅导入所需的软件包：

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