如何Lodash 是 JavaScript 很有名的 package，尤其 於 理 array 很有一套，Angular 如何使用 lodash 呢 ? 也可以 在 Angular 使用 JavaScript package 的 SOP。
Version
Node.js 8.9.4
Angular CLI 1.6.2
Angular 5.2.2
安 Lodash
~/MyProject $ npm install lodash --save
使用 npm 安 lodash 。
安 Lodash Type 定
~/MyProject $ npm install @types/lodash --save-dev
JavaScript 有型 ，但 TypeScript 是 型 言，除了型 外 有泛型， 怎 JavaScript 搭配呢 ?
TypeScript 的解 方案是另外使用 *.d.ts ，此 type 定 。
一般 ，若是知名的 JavaScript library，都已 有人 type 定 ，其 package 的 是 @types/package 。
由於 type 定 只是 TypeScript 使用，以此加上 --save-dev 。
tsconfig.json{ "compileOnSave": false, "compilerOptions": { "outDir": "./dist/out-tsc", "sourceMap": true, "declaration": false, "moduleResolution": "node", "emitDecoratorMetadata": true, "experimentalDecorators": true, "target": "es5", "typeRoots": [ "node_modules/@types" ], "types" : ["lodash"], "lib": [ "es2017", "dom" ] }}14 行
"types" : ["lodash"],
在 typeRoots 新增 types ，在 列中加入 lodash ，表示 TypeScript 在 使用 安 的 lodash type 定 。
Import Lodashapp.component.tsimport {Component, OnInit} from '@angular/core';import * as _ from 'lodash';@Component({ selector: 'app-root', templateUrl: './app.component.html', styleUrls: ['./app.component.css']})export class AppComponent implements OnInit { title = 'app'; ngOnInit(): void { const scores: number[] = [100, 99, 98]; _.remove(scores, 2); scores.forEach((score) => console.log(score)); }}第 2 行
import * as _ from 'lodash';
入 lodash 。
因 lodash 以 _ 使用，因此 import 特 取 名 _
WebStorm 於 Angular 建的 API，都可以自 import，但 於 JavaScript 的 package，目前 WebStorm 有 法自 import，需手 入
15 行
_.remove(scores, 2);
列的移除元素一直是 JavaScript 比 麻 的部分，透 lodash 的 remove() ，可以很 的使用。
Conclusion
上若有 Angular 版本的 package， 然 先使用；若遇到必 使用 JavaScript package 不可的 合，除了安 package 外， 要安 type 定 ， 且在 tsconfig.json 定，如此才可以在 Angular 正 使用 通
Sample Code
完整的 例可以在我的GitHub 上找到
总结
以上所述是小编给大家介绍的在 Angular中 使用 Lodash 的方法，希望对大家有所帮助，如果大家有任何疑问请给我留言，小编会及时回复大家的。在此也非常感谢大家对武林网网站的支持！
新闻热点
疑难解答
