I took my own advice and decided to make a new project. Here are my notes for adding a new page to the boilerplate.
- Add a reference to the HeaderController in
/public/js/controllers/header.jsin $scope.menu - Add a route for the new link's path in
/public/js/config.js. (hmm... they use $stateProvider instead of $routeProvider) Include a templateUrl. - Create a template in
/app/public/views/.- note - They use data-ng-foo for their directives. data- is ignored by Angular JS. This is just for html validation purposes. When in Rome...
- Add a controller to the template. Cry when you refresh because Angular is sad.
- Create a module to attach the controller to in
/public/js/app.js. Since they've already got everything hooked up to the 'mean' module, just dangle from that.angular.module('mean.notes', []);
I made a mistake at this point (metioned at the end). Next time, I won't. Learning is fun!
- Create the controller in
/public/js/controllers/notes.js. Attach the controller to the module created above.- You can pretty much copy the first line of the definition from articles.js, just remove the Articles injection and name the controller correctly.
- Add a $scope variable to the controller (
$scope.foo = 'bar';) and in the view (step 3 above -{{ foo }}) so you can be assured it's all working.
- Add the controller reference so Angular won't cry anymore. Look for Application Controllers in
/app/views/includeds/foot.html. - Restart the server.
Dang
:( OK, everything seems hooked up, but the controller isn't found for some reason. I added a breakpoint in the new controller, and it is being loaded. I kept getting
Error: [ng:areq] http://errors.angularjs.org/1.2.13/ng/areq?p0=NotesCtrl&p1=not%20a%20function%2C%20got%20undefined
It turns out, although we set up a namespace and defined everything, the new controller was never injected into the main app's "mean" module. This was not noticed for a bit because of the in my opinion bad formatting that caused the dependencies to go way off the page.
tl;dr
Format the verbose injection so you can see everything!
You can't just define a module and add a reference to the script. You have to inject it!
