I've been playing around with AngularJS - which is a kick-ass front end framework by the way.
Today I tried to incorporate the angular-seed starter app (found here: https://github.com/angular/angular-seed) into a currently existing Rails 3.1.3 application.
Had a few issues getting the demo code - here: http://docs.angularjs.org/#!/tutorial - to work in the asset pipeline, so just for testing purposes I put them into the public folder - old school style.
I followed the tutorial and had all of my views, controllers, services set up correctly. However, when I included the js files at the bottom of my index page:
<script src="angular/app/lib/angular/angular.js" ng:autobind></script>
<script src="angular/app/js/services.js"></script>
<script src="angular/app/js/controllers.js"></script>
... none of the controllers would work. I would get the {{ model.property }} tags within my templates instead of the actual output.
No Javascript errors in Chrome's dev tools - and network and resources showed all expected files loaded properly.
I thought that maybe I had overlooked something in my code, but when I looked at the developers guide, there is a link to angular's cdn:
<script src="http://code.angularjs.org/angular-0.9.19.min.js" ng:autobind></script>
Just for the heck of it, I replaced my local angular.js script call with the cdn, and suddenly everything was working as expected.
I double checked, to make sure that I was loading the local copy from the proper directory, and I was - it's the standard directory that comes with the angular-seed file. This file was also showing as a resource that was downloaded properly.
Anyone have ideas on why the cdn worked but the local copy would not?
The angular-seed uses AngularJS 1.0.0rc5 (currently) which is incompatible with 0.9.19. Check out how the seed app is wired. (e.g. remove ng:autobind and add ng:app or ng-app to the html tag in your layout template).
Looks like you are using an old version: You want to read this: http://docs.angularjs.org/#!/guide/dev_guide.bootstrap.auto_bootstrap
What you should be doing is using the new version, and the docs are here: http://docs-next.angularjs.org/guide/dev_guide.bootstrap.auto_bootstrap
For one thing, you're missing a double-quote in your first script reference.
Related
Recently I was going through the plunker compiler, I have not used mongodb before, and do not wish to set it up for understanding how the compiler is working. So, I would like to know, how can i setup this project removing the mongodb adapter, with only the core compiling feature, also, can anybody point me to the code that is responsible for compiling the angularjs and other javascript framework codes?
I have not used mongodb before, and do not wish to set it up for understanding how the compiler is working.
The Plunker run server does not have a dependency on mongo. When it renders plunks it pulls them from the Plunker API server defined here.
can anybody point me to the code that is responsible for compiling the angularjs and other javascript framework codes?
The Plunker run server does not actually compile libraries like Angular and other frameworks. When the Plunker package catalogue adds these frameworks to a Plunk, it injects <script src="http://.."></script> or <link rel="stylesheet" href="http://.."> tags into the index.html. Since those bits of code are available at public urls, your browser is pulling them from those locations when you preview your work and the Plunker run server is not involved at all.
As for compilation which happens in other circumstances, as described in the README, th
Trying to write (copy) a test Angular project in eclipse. Have the the three files from Angular website https://docs.angularjs.org/api/ng/directive/ngController in my eclipse project(which I created as static web project then converted to Angular project). Does not display values correctly. Clear works. Alert etc don't.
Can someone please advise?!
Just copy this link into your head tag:
<script src="http://ajax.googleapis.com/ajax/libs/angularjs/1.2.26/angular.min.js"></script>
also may I ask you why you are using Eclipse and not a more simple editor like notepad++ or sublime? I never heard of an angular.js programmer who uses Eclipse.
Just go the link here and follow the steps in your eclipse. But in my eclipse given CDN in this link does not work. So I changed the CDN server to <script src="http://ajax.googleapis.com/ajax/libs/angularjs/1.2.26/angular.min.js"></script> .It is work well. May be OK.
I have a website built on the MEAN.io stack and am trying to generate PDF files on the client side with pdfmake. One can install pdfmake with bower (it looks like they used browserify to generate the client-side version).
I am struggling to get it to work. Either the injection of pdfmake does not work (I assume it cannot be found) or the pdfmake object is undefined (if I don't add pdfmake as a dependancy). I assume pdfmake needs to be packaged in some way to make it accessible, but I don't know how.
In config/assets.json I added:
"bower_components/pdfmake/build/pdfmake.js"
In the HTML corresponding to the JS file in which I want to use pdfmake I added:
<script src="bower_components/pdfmake/build/pdfmake.js"></script>
<script src="bower_components/pdfmake/build/vfs_fonts.js"></script>
I have set up a basic version on Github. I would really appreciate it if someone could explain to me how to make it possible to make pdfmake available for use in packages/system/public/controllers/index.js, for example.
I was recently have a similar problem. It seems to come from the fact that pdfmake isn't yet "browserfiable." After much troubleshooting, I was able to get it working through simply including the two client-side scripts pdfmake.min.js and vfs_fonts.js via script tags in my build directory. That's it.
Try moving the two script tags out of the bower_components directory and into your build directory. Make sure they're before your bundle.js, or generally whatever scripts need pdfmake.
I don't fully understand how bundled scripts are able to see the global objects created by these two files, but I think it's because they're setting pdfMake to the window object:
(The vfs_fonts.js file starts like this:)
window.pdfMake = window.pdfMake || {}; window.pdfMake.vfs
Since Browserify sets the global object to window, this approach seems to work. (Though I don't fully understand why... see this Github issue on their repo for more explanation and the deglobalify npm package.)
Here's another relevant post I was able to find.
I bought a template which should not have problem with AngularJS according authors. When I have one big index then everything works fine. But the problem is when I try to separate it into the smaller template. I have downloaded new AngularJS seed and just did this:
.. header
.. body
<div ng-view></div>
<!-- Vendor Scripts Bundle -->
<script src="vendor.min.js"></script>
<!-- App Scripts Bundle -->
<script src="scripts.min.js"></script>
.. angularJS files
Route to the smaller template works fine, the content is visible, but just these two javascript libraries doesn't work. When I look at code in chrome inspect I see that libraries exist. Is necessary to register them somewhere in AngularJS or must be problem in these libraries?
Whatever AngularJS components you define outside AngularJS will remain outside AngularJS - unless they are integrated at ".config()" state of the app.
The global objects should be usable though (e.g. $ for jQuery); although cleanly would be defined as constants.
The question is pretty generic, I think you need to provide more insight into that to get some proper help, as the comments above stated.
I saw 2 errors at console on plunker.
Uncaught ReferenceError: config is not defined app.js:10
Uncaught Error: No module: ngRoute
Looking at your code I see a few errors. First of all you're using 1.0.x version of AngularJS. In those versions ngRoute is not a separate module so you shouldn't include that. Also you defined view1 modules as view1 but tried to include as myApp.view1. When you fix those issues your code should work.
I am currently trying to get an instance of the WebGL context in HaxeJS using FlashDevelop. I would like to use the stdjs library.
I have imported the dependencies using haxelib with:
haxelib git xirsys_stdjs https://github.com/xirsys/stdjs.git haxelib
I tested its availability with:
haxelib list
I then added it to the library section in FlashDevelop - see pic
**I have included the the library in the classpaths (I really don't know if I should, but without it, compile won't even take place) - See pic **
I've then taken the WebGL specific code from the following github repo:
https://github.com/mikecann/WebGLTerrainicles/blob/master/src/Main.hx
When I try to compile the project, it opens up my browser as expected, however, in the console there is an issue as there are missing libraries:
Obviously I'm missing something here (perhaps in the import process?) - I've looked but can't find much information on getting WebGL working for Haxe with the stdjs externs etc using FlashDevelop and any help would be great.
Looks like there is a problem with xirsys_stdjs lib.
The reference project you link to is using only one file called Html5Dom.hx (originally from Jeash project) to define the HTML5/webgl API. You don't need xirsys_stdjs if you reuse this file.
While you're at it, mikecann's project seems to include a lot of basic classes to get started writing webgl in haxe.