loicmarie / ng2-chessboard

Angular 2 module wrapping chessboardjs library as a component
MIT License
3 stars 5 forks source link

Can't use ng2-chessboard in my angular 2+ application #2

Open F0b0s opened 5 years ago

F0b0s commented 5 years ago

Hello, i'm trying to import ng2-chessboard module into my angular 2+ application. When i open application in browser i've got and error:

ERROR ReferenceError: ChessBoard is not defined at ChessboardComponent.load (ng2-chessboard.es5.js:304) at ChessboardComponent.ngOnInit (ng2-chessboard.es5.js:327) at checkAndUpdateDirectiveInline (core.js:12411) at checkAndUpdateNodeInline (core.js:13935) at checkAndUpdateNode (core.js:13878) at debugCheckAndUpdateNode (core.js:14771) at debugCheckDirectivesFn (core.js:14712) at Object.eval [as updateDirectives] (AppComponent.html:2) at Object.debugUpdateDirectives [as updateDirectives] (core.js:14697) at checkAndUpdateView (core.js:13844)

Environment: angular 5.2.11, browser: Chrome, packages: "dependencies": { "@angular/animations": "^5.2.0", "@angular/common": "^5.2.0", "@angular/compiler": "^5.2.0", "@angular/core": "^5.2.0", "@angular/forms": "^5.2.0", "@angular/http": "^5.2.0", "@angular/platform-browser": "^5.2.0", "@angular/platform-browser-dynamic": "^5.2.0", "@angular/router": "^5.2.0", "chessboardjs": "0.0.1", "core-js": "^2.4.1", "ng2-chessboard": "^1.0.3", "rxjs": "^5.5.6", "zone.js": "^0.8.19" }, I've imported ChessboardModule in app.module.ts ... import {ChessboardModule} from 'ng2-chessboard'; ... imports: [ ... ChessboardModule ] ... And i have simple component with the following markup: <h2>It works!!</h2> <ng2-chessboard [(position)]="position"></ng2-chessboard>

After loading the page in browser it writes an error in console.

In my opinion the error in this code: ChessboardComponent.prototype.load = function () { this.board = ChessBoard('ng2-board', { The type ChessBoard has not been imported, but i don't understand how to properly import it. Thanks for help.

sandysaahil commented 4 years ago

Hey did you find the solution for this? I am facing same problem.

F0b0s commented 4 years ago

Hello, yes, i did it. You can check how it works in my Chess repo, angular app is in src->frontend folder.

sandysaahil commented 4 years ago

Thanks F0B0s.