search

dougludlow / ng2-bs3-modal

Angular Bootstrap 3 Modal Component
http://dougludlow.github.io/ng2-bs3-modal/
ISC License
261 stars 133 forks source link

ERROR TypeError: this.$modal.modal is not a function #244

Closed ranjik2909 closed 6 years ago

ranjik2909 commented 6 years ago

Angular 5.2.11 ng2-bs3-modal version 0.13.0

I am trying to update angular version from 4.0 to 5.2. But ng2-bs3-modal is not working for me. Following is the error I am seeing in the console.

ng2-bs3-modal error

I previously used version 0.12.1 with angular 4.0. I did not have this issue then.

Note: The error I am seeing is after I put the following in app.module.ts

import * as $ from 'jquery'; window["$"] = $; window["jQuery"] = $;

Before this the error was 'jQuery is not defined'

image

I am using angular-cli. Following is the order of scripts loaded in angular.json file (angular-cli.json in angular 4.0)

"scripts": [ "node_modules/jquery/dist/jquery.js", "node_modules/bootstrap/js/modal.js", "node_modules/ng2-bs3-modal/ng2-bs3-modal.js" ]

I appreciate any help. Thanks.

dougludlow commented 6 years ago

Try removing jquery and bootstrap from your scripts and then do the following:

Add a file called jquery.ts and copy in the following:

import * as $ from 'jquery';
window["jQuery"] = window["$"] = $

Then in your main.ts add the following to the top of the file:

import './jquery';
import 'bootstrap/js/modal';
dougludlow commented 6 years ago

Checkout the demo's main.ts for an example.