Wahlin https://www.youtube.com/watch?v=i9MHigUZKEM Introduction to Angular JS by David Mosher https://www.youtube.com/watch?v=8ILQOFAgaXE Introduction to Angular.js in 50 Examples by Curran Kelleher https://www.youtube.com/watch?v=TRrL5j3MIvo
provides: Routing Templating Data Binding Forms Validation Reusable Components Built-in Module System In other words… Everything you need to build rich and interactive web apps.
server without reloading the page. Key Difference: Rather than relying on a view technology to perform server- side rendering of the data to HTML, a RESTful web service simply populates and returns a JSON object. thefloppydisk.wordpress.com
object. Add behavior to the $scope object. ✗DON’T Manipulate DOM. Filter output. Share code or state across controllers. Manage the life-cycle of other components
dependency injection. A service fall into three categories: • Service (simplest / least flexible) • Factory (good balance / most common) • Provider (very verbose / most flexible) http://stackoverflow.com/questions/15666048/angular-js-service-vs-provider-vs-factory
dependency injection. A service fall into three categories: • Service (simplest / least flexible) • Factory (good balance / most common) • Provider (very verbose / most flexible) TL;DR: Just use the factory service! http://stackoverflow.com/questions/15666048/angular-js-service-vs-provider-vs-factory
dependency injection. A service fall into three categories: • Service (simplest / least flexible) • Factory (good balance / most common) • Provider (very verbose / most flexible) TL;DR: Just use the factory service! http://stackoverflow.com/questions/15666048/angular-js-service-vs-provider-vs-factory myApp.controller('LoginCtrl', function($scope, Auth) { $scope.login = function() { Auth.signIn(); }; $scope.signOut = function() { Auth.signOut(); }; }); services/auth.js controllers/login.js
dependency injection. A service fall into three categories: • Service (simplest / least flexible) • Factory (good balance / most common) • Provider (very verbose / most flexible) TL;DR: Just use the factory service! http://stackoverflow.com/questions/15666048/angular-js-service-vs-provider-vs-factory myApp.controller('LoginCtrl', function($scope, Auth) { $scope.login = function() { Auth.signIn(); }; $scope.signOut = function() { Auth.signOut(); }; }); services/auth.js controllers/login.js
like so without worrying where $scope comes from; http://chris.59north.com/post/2014/02/27/A-simple-introduction-to-AngularJS-Part-6-%E2%80%93-Dependency-injection-in- Angular-using-$provide.aspx angular.module('MyApp') .controller('UserCtrl', function($scope) { $scope.currentUser = { firstName: 'John', lastName: 'Doe' }; });
to write our Angular code without worrying about the order in which our code is loaded. It allows us to use the same syntax across Angular components and not concern ourselves with how dependencies arrive. It gives us the ability to write tests efficiently and not worry about how to separate production components from those in testing. http://www.ng-newsletter.com/posts/deep-dive-in-angular-dependency-injection.html
Templates – HTML with additional Angular markup. View – a rendered template. DI – used for loading modules and services. In layman terms…
Templates – HTML with additional Angular markup. View – a rendered template. DI – used for loading modules and services. Service – place to do heavy lifting stuff like AJAX requests. In layman terms…
Templates – HTML with additional Angular markup. View – a rendered template. DI – used for loading modules and services. Service – place to do heavy lifting stuff like AJAX requests. Directive – behavior abstraction (HTML on steroids). In layman terms…
Templates – HTML with additional Angular markup. View – a rendered template. DI – used for loading modules and services. Service – place to do heavy lifting stuff like AJAX requests. Directive – behavior abstraction (HTML on steroids). Data Binding – keeps the data in-sync with UI. In layman terms…
Templates – HTML with additional Angular markup. View – a rendered template. DI – used for loading modules and services. Service – place to do heavy lifting stuff like AJAX requests. Directive – behavior abstraction (HTML on steroids). Data Binding – keeps the data in-sync with UI. Model – stuff that lives on $scope object. In layman terms…
Templates – HTML with additional Angular markup. View – a rendered template. DI – used for loading modules and services. Service – place to do heavy lifting stuff like AJAX requests. Directive – behavior abstraction (HTML on steroids). Data Binding – keeps the data in-sync with UI. Model – stuff that lives on $scope object. Scope – glue between a controller and a template. In layman terms…
Templates – HTML with additional Angular markup. View – a rendered template. DI – used for loading modules and services. Service – place to do heavy lifting stuff like AJAX requests. Directive – behavior abstraction (HTML on steroids). Data Binding – keeps the data in-sync with UI. Model – stuff that lives on $scope object. Scope – glue between a controller and a template. Controller – a place where you set the $scope. In layman terms…
Templates – HTML with additional Angular markup. View – a rendered template. DI – used for loading modules and services. Service – place to do heavy lifting stuff like AJAX requests. Directive – behavior abstraction (HTML on steroids). Data Binding – keeps the data in-sync with UI. Model – stuff that lives on $scope object. Scope – glue between a controller and a template. Controller – a place where you set the $scope. Filters – returns the subset of data or formats the output. In layman terms…
style guide. 3. Your code should be clean and readable. 4. Always use strict equality ===. 5. Always write semicolons. 6. Prefer spaces over tabs. General Tips
style guide. 3. Your code should be clean and readable. 4. Always use strict equality ===. 5. Always write semicolons. 6. Prefer spaces over tabs. 7. Use Boolean instead of !! for type coercing. General Tips
style guide. 3. Your code should be clean and readable. 4. Always use strict equality ===. 5. Always write semicolons. 6. Prefer spaces over tabs. 7. Use Boolean instead of !! for type coercing. 8. Don’t over-use comments; refer to 3. General Tips
style guide. 3. Your code should be clean and readable. 4. Always use strict equality ===. 5. Always write semicolons. 6. Prefer spaces over tabs. 7. Use Boolean instead of !! for type coercing. 8. Don’t over-use comments; refer to 3. 9. Keep your code DRY. General Tips
style guide. 3. Your code should be clean and readable. 4. Always use strict equality ===. 5. Always write semicolons. 6. Prefer spaces over tabs. 7. Use Boolean instead of !! for type coercing. 8. Don’t over-use comments; refer to 3. 9. Keep your code DRY. General Tips
style guide. 3. Your code should be clean and readable. 4. Always use strict equality ===. 5. Always write semicolons. 6. Prefer spaces over tabs. 7. Use Boolean instead of !! for type coercing. 8. Don’t over-use comments; refer to 3. 9. Keep your code DRY. General Tips
style guide. 3. Your code should be clean and readable. 4. Always use strict equality ===. 5. Always write semicolons. 6. Prefer spaces over tabs. 7. Use Boolean instead of !! for type coercing. 8. Don’t over-use comments; refer to 3. 9. Keep your code DRY. 10. Avoid early optimization / refactor code often. General Tips
style guide. 3. Your code should be clean and readable. 4. Always use strict equality ===. 5. Always write semicolons. 6. Prefer spaces over tabs. 7. Use Boolean instead of !! for type coercing. 8. Don’t over-use comments; refer to 3. 9. Keep your code DRY. 10. Avoid early optimization / refactor code often. 11. Use a linter tool, e.g. JSHint or JSLint. General Tips
style guide. 3. Your code should be clean and readable. 4. Always use strict equality ===. 5. Always write semicolons. 6. Prefer spaces over tabs. 7. Use Boolean instead of !! for type coercing. 8. Don’t over-use comments; refer to 3. 9. Keep your code DRY. 10. Avoid early optimization / refactor code often. 11. Use a linter tool, e.g. JSHint or JSLint. General Tips
style guide. 3. Your code should be clean and readable. 4. Always use strict equality ===. 5. Always write semicolons. 6. Prefer spaces over tabs. 7. Use Boolean instead of !! for type coercing. 8. Don’t over-use comments; refer to 3. 9. Keep your code DRY. 10. Avoid early optimization / refactor code often. 11. Use a linter tool, e.g. JSHint or JSLint. General Tips
style guide. 3. Your code should be clean and readable. 4. Always use strict equality ===. 5. Always write semicolons. 6. Prefer spaces over tabs. 7. Use Boolean instead of !! for type coercing. 8. Don’t over-use comments; refer to 3. 9. Keep your code DRY. 10. Avoid early optimization / refactor code often. 11. Use a linter tool, e.g. JSHint or JSLint. 12. Keep global variables to a minimum. General Tips