Call Angular Component method from an imported library

Question

Here is my Angular component:

import { basketModule } from './wind'

@Component({
  selector: 'app-login',
  templateUrl: './login.component.html',
  styleUrls: ['./login.component.css']
})
export class LoginComponent implements OnInit {



    constructor(){
    }

    ngOnInit(){
        basketModule.init()
    }

    public dataMain(){
        alert('hi')
    }
}

Here is the wind.js file which is imported above.

export var basketModule = (function () {

return {

  init: function(){
       dataMain()
    }

}
})();

When I run the above code, it returns an error that

core.es5.js:1020 ERROR ReferenceError: dataMain is not defined

How to access the Angular component method dataMain from the imported library ?

You mix up AngularJS with Angular2 better to use all files in .ts unless you want to import your old project. — Swoox
– Swoox, Commented Aug 25, 2017 at 7:06
do you want to use third party libs in Angular this might help — Rahul Singh
– Rahul Singh, Commented Aug 25, 2017 at 7:32

diopside · Accepted Answer · 2017-08-25 07:12:54Z

1

If you're using AngularCLI, you will need to add that file to the scripts section of the angular-cli.json file.

"scripts": [
     // path to script here in quotes
 ],

And regardless of whether you're using angular cli, make sure the 'allowJs' flag in your tsconfig.json file is set to true.

 {
     "compilerOptions": {
       "target": "es5",
       "sourceMap": true,
       "allowJS": true   // this one
   }
}

Then try importing the library in your component

import * as wind from './path/to/lib/wind.js'

Now you should be able to access that libraries functions using the 'wind' name

 wind.dataMain();

answered Aug 25, 2017 at 7:12

diopside

3,05213 silver badges23 bronze badges

Sign up to request clarification or add additional context in comments.

Comments

Dan M. CISSOKHO · Accepted Answer · 2017-08-25 07:08:19Z

0

If you want an A file methode in a B file so you should import A in B

But you should put your methode in a service and then import service in wind.js

answered Aug 25, 2017 at 7:08

Dan M. CISSOKHO

1,0851 gold badge14 silver badges28 bronze badges

Collectives™ on Stack Overflow

Call Angular Component method from an imported library

2 Answers 2

Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related