Lodash _.findIndex not working in tsd install lodash –save in angular2

I have implemented lodash in two methods:

Method 1:
I have Install in bower_component and make a declare var _:any; in components. Its working fine

In click event i am calling this function:

checkLodash(){
        _.forEach({ 'a': 1, 'b': 2 }, function(value, key) {
          console.log(key);
        });


        let a = _.findIndex(this.users, 'active');
        console.log(a)
    }

Everything works fine. but I got this issue in production

EXCEPTION: ReferenceError: _ is not defined

I got some solution from here [Lodash in angular2, declare var_:any not working

Method 2:
In my app there is no systemjs because i am using [seed-app][1], so i have used
tsd install lodash --save
and

import * as _ from 'lodash';

I am calling this function in click event

 constructor() {
        this.show_data = "hello";
        this.users = [
            { 'user': 'barney', 'active': false },
            { 'user': 'fred', 'active': false },
            { 'user': 'pebbles', 'active': true }
        ];
        _.forEach({ 'a': 1, 'b': 2 }, function(value, key) {
            console.log(key);
        });
    }

    checkLodash() {
        _.forEach({ 'a': 1, 'b': 2 }, function(value, key) {
            console.log(key);
        });


        let a = _.findIndex(this.users, 'active');
        console.log(a)
    }

Now my output is :
a
b
(in console.log)
If i click button to call checkLodash function, i am getting this error,

EXCEPTION: Error during evaluation of "click"
ORIGINAL EXCEPTION: TypeError: _.findIndex is not a function
browser_adapter.js:76 TypeError: _.findIndex is not a function
    at LodashWithoutDeclare.checkLodash (lodash-without-declare.ts:31)
    at AbstractChangeDetector.ChangeDetector_LodashWithoutDeclare_0.handleEventInternal (viewFactory_LodashWithoutDeclare:75)
    at AbstractChangeDetector.handleEvent (abstract_change_detector.js:57)
    at AppView.triggerEventHandlers (view.js:221)
    at eval (viewFactory_LodashWithoutDeclare:130)
    at dom_renderer.js:282
    at dom_events.js:28
    at ZoneDelegate.invoke (angular2-polyfills.js:332)
    at Object.NgZoneImpl.inner.inner.fork.onInvoke (ng_zone_impl.js:44)
    at ZoneDelegate.invoke (angular2-polyfills.js:331)

How to fix this issue?

2
Leave a Reply

avatar
2 Comment threads
0 Thread replies
0 Followers
 
Most reacted comment
Hottest comment thread
1 Comment authors
Jason Recent comment authors
  Subscribe  
newest oldest most voted
Notify of
Jason
Guest

Check your lodash distribution, i guess its not full build, just core.

Jason
Guest

tsd is depricated. Use this way npm install lodash --save typings install lodash --ambient --save before that make sure you install typings globally npm install typings -g Then in your angular-cli-build.json , make sure it remains like this way module.exports = function(defaults) { return new Angular2App(defaults, { vendorNpmFiles: [ ... 'lodash/**/*.js' ] }); }; and in your system-config.ts: /** Map relative paths to URLs. */ const map: any = { 'lodash': 'vendor/lodash/lodash.js' }; /** User packages configuration. */ const packages: any = { 'lodash': { format: 'cjs' } }; in your src/index.html add this line <script src="/vendor/lodash/lodash.js" type="text/javascript"></script> now in… Read more »