Jasinski Technical Wiki

Navigation

Home Page
Index
All Pages

Quick Search
»
Advanced Search »

Contributor Links

Create a new Page
Administration
File Management
Login/Logout
Your Profile

Other Wiki Sections

Software

PoweredBy

Page History: Angular Notes

Compare Page Revisions



« Older Revision - Back to Page History - Newer Revision »


Page Revision: Mon, Sep 09, 2013, 10:41 AM



Precautions

  • Using Angular can hurt SEO rankings - unless special code is written to avoid this pitfall
  • Avoid using Angular if the client is running IE7 or older. Using IE8 may require special handling for custom tags.

Getting Started

1. Reference the Angular JS file as your first <script> reference

<script type="text/javascript" src="/Scripts/angular.js"></script>
<script type="text/javascript" src="/Scripts/angular-resource.js"></script>
<script type="text/javascript" src="/Scripts/OtherScripts.js"></script>

2. Add JavaScript code to define your Angular app

var MyApp = angular.module('MyAppName', ['ngResource']);

3. Add the data-ng-app attribute to "register" your app within the HTML code

<html data-ng-app='MyAppName'>

Angular Variables

  • $compile — service
  • $element
  • $first — used with loops?
  • $filter
  • $http
  • $index — loop index
  • $last — used with loops?
  • $location
  • $middle — used with loops?
  • $$phase
  • $q — service
  • $resource
  • $rootScope
  • $routes
  • $routeProvider — used for configuring routes. Requires the ngRoute module.
  • $scope

  • $apply$scope method
  • $broadcast$scope method
  • $digest
  • $emit$scope method
  • $inject — Controller method
  • $on$scope method
  • $onFailure$scope method
  • $onReady$scope method
  • $prepareForReady$scope method
  • $watch$scope method
  • $whenReady$scope method

Modules

TODO

Bindings

TODO

Dependency Injection

TODO

Routes

When the user access a URL (e.g., clicking a link), routes define which controller is used to respond to the request.

App.config(['$routeProvider', function($routes) {

  $route.when('/',{
    templateUrl : '/templates/home.html',
    controller : HomeCtrl
  });

  $route.when('/register',{
    templateUrl : '/templates/register.html',
    controller : RegisterCtrl
  });

  $routes.otherwise({
    redirectTo : '/'
  });

}]);

Controllers and Scope

TODO

Services

TODO

Models

TODO

Directives

TODO

Filters

TODO

ScrewTurn Wiki version 3.0.1.400. Some of the icons created by FamFamFam. Except where noted, all contents Copyright © 1999-2024, Patrick Jasinski.