ketys Posted March 31, 2015 Share Posted March 31, 2015 Hi, I've got a following problem. I've got a main index.html template, where is placed:...<script src="js/game/game.js"></script>...<div ng-view></div>...On the game page, my template looks similar to this:<div class="jumbotron text-center"><h1>Game Page ou Yeah!</h1><div id="game-canvas"></div></div>And at last, in my game.js file is only one row with: var game = new Phaser.Game('100', '100', Phaser.AUTO, 'game-canvas');My problem lies in that the phaser object is displaying on every page and outside the game-canvas div. I would like to place it only on game page in #game-canvas. How can I do this? Thanks for answers! Link to comment Share on other sites More sharing options...
Akshar Patel Posted April 1, 2015 Share Posted April 1, 2015 What's happening here is that before the Angular Application gets bootstrapped, there is no div with id of 'game-canvas'. Hence, when game.js is loaded, it can't find the specific div and so it creates the Phaser game outside the required div. One possible solution is that you include the game logic in the controller or scope in which the template resides. Or, try loading the script in the template itself. Hope this helps. Link to comment Share on other sites More sharing options...
jdnichollsc Posted September 10, 2016 Share Posted September 10, 2016 You need to use an Angular directive, check my example! http://market.ionic.io/plugins/ionphaser Regards, Nicholls Link to comment Share on other sites More sharing options...
Recommended Posts