How do i use lodash with Ionic 2?

Starting from Ionic 2 RC0 you have to do the following.

npm install @types/lodash --save-dev --save-exact

and import it like

import _ from 'lodash';

For Future Users of Ionic 3

npm install lodash --save
npm install @types/lodash --save

Official Doc

npm install will download a copy of the library from NPM and save it in your app’s node_modules directory. --save will tell the NPM CLI to add an entry to your app’s package.json dependency list. You can use the library now.

If you want to import all functions from lodash then use

import lodash from 'lodash';
lodash.capitalize('myStringToCapitalize');

If you want to use specific function from lodash then use

import { shuffle } from 'lodash';
shuffle(results);

Actually none of the answers above mention that you need to install lodash's type definitions if you are trying to use lodash in your ionic 2 app. To install lodash's type definitions to your project run the following commands:

• Install typings node module as global (if you have not already): sudo npm install typings --global
• Install lodash to your project: npm install lodash --save
• Install lodash's type definitions: typings install lodash --save

Once you are finished installing lodash's type definitions to your project you can import lodash to your ionic2 .ts file like this:

import * as _ from 'lodash';

UPDATE: 10/02/2017 Ionic team published a document how to use 3rd party libraries in Ionic projects. Please refer here to see an example of how to use lodash with latest ionic http://ionicframework.com/docs/developer-resources/third-party-libs/

For angular 2

1. Install lodash with npm:

   npm i -S lodash

2. Import lodash like this:

   import * as _ from 'lodash';

For angular 1.x

1. Install packages with bower:

   bower install --save ng-lodash

2. Include scripts in your index.html between ionic.bundle.js and app.js:

3. Add module as a dependency to your app

   angular.module('starter', ['ionic', 'starter.controllers', 'starter.services', 'ngLodash'])

4. Inject into your controller and start using it

   .controller('yourController', function($scope, lodash) { lodash.assign({ 'a': 1 }, { 'b': 2 }, { 'c': 3 }); });

For me its working with type definition on ionic 2 (2.0.0.beta.11)

steps

sudo npm install typings --g

Secondly

npm install lodash --save

and

typings install lodash --save

Finally use lodash into project with

import * as _ from 'lodash';

and

var index = _.indexOf(albumList, data.album.id)
console.log(index);

This must be the Correct answer With Ionic 2.1.0

Try this:

npm install -g typings
typings search lodash
typings install lodash --save

Maybe this blog may help you

Since it's all depended on the Ionic 2 version you're using, and none of the above was 100% my solution, but did get me to the right point eventually. I want to add my version of the answer for the following version of Ionic 2

ionic framework version: 3.5.0
typescript: 2.3.3

And I didn't had to install anything, Lodash was simply there inside the node_modules/lodash directory.

The only thing I did inside my application .ts files is:

import * as Lodash from 'lodash';

// Inside the class
new_array = Lodash.shuffle(data_array);

It should be noted that for each component you can add the specific lodash type instead of importing all of lodash with what has been mentioned before import * as _ from 'lodash';

So in the component if you are only using isMatch you can just easily add it as

import { isMatch } from 'lodash';

and then use it like so

isMatch(this.foo1, this.foo2);

This explicitly declares what you are using and helps with maintainability when working with more then 1 dev on a component