1. Forside

2. Frederik Nakstad
/fnakstad
/in/fnakstad
frederiknakstad.com

3. • JavaScript rammeverk for å lage SPA
• Påbegynt av Miško Hevery i 2009
• Open-source på Github
• Agnostisk iht. server-side rammeverk
• Regresjonstester kjøres på IE 8 >=

4. Grunnleggende Konsepter
• Data binding
• Directives
• Scope
• Dependency Injection

5. Data Binding

6. Data Binding

7. Scope

8. Directives
<span ng-bind="exp"></span>
<span class="ng-bind: exp;"></span>
<ng-bind></ng-bind>
<!-- directive: ng-bind exp -->

9. Directives
<map location="venue.location"
static-map="venue.staticMap"
type="roadmap"></map>
<google-map center="center"
draggable="true" zoom="zoom"
markers="markers" mark-click="true"
style="height: 400px"></google-map>

10. Dependency Injection
1. // App-level module, has injector
2. var myApp = angular.module('myApp', ['dependency']);
3.
4. // Attach custom service to app
5. myApp.factory('Math', function() {
6. return {
7. add: function(x, y) { return x + y; },
8. subtract: function(x, y) { return x - y; },
9. pi: 3.14159265359,
10. e: 0.5772156649
11. };
12.});
13.
14.myApp.factory('Circle', function(Math) {
15. return {
16. circumference: function(r) { return 2 * Math.pi * r; },
17. area: function(r) { return Math.pi * r * r; }
18. };
19.});

11. Skeptisk...

12. Nyttige ressurser og verktøy
• Angular.js sin offisielle dokumentasjon
• Angular-UI
• Batarang Chrome extension
• Angular-seed på GitHub
• Testacular/Karma
• Egghead.io video tutorials