Please enable JavaScript.

Coggle requires JavaScript to display documents.

AngularJS (Apps: myApp = angular.module('myApp', [dependencies...]…

- - - - {{ name }}
      - {{ myFunction() }}
    - - ng-model binds to the $scope
      - ng-if
      - ng-show / ng-hide
      - ng-class
      - ng-repeat
      - event directives
        
        ng-click, etc.
      - ng-cloak (for slow internet connections)
    - - { templateUrl: 'templates/xx', replace: true }
        
        restrict: 'AEM'
        
        "A'" = Attribute
        
        "E" = Element
        
        "C" = Class
        
        "M" = Comment
        
        Use a separate template file
      - use camelCase in JS. string-dash in HTML for directives
      - Isolate scope to avoid collisions; poke holes to allow values through
        
        scope: { person: "" }
        
        "" = text
        
        "=" = object (2-way binding)
        
        "&" = function
        
        Use object map for params
      - compile: function(elem, attrs) {}; gives ability to alter elements and attributes when the template is first 'compiled'
        
        returns an object with optional { params }
        
        link gives ability to alter elements each time it is used.
        
        { pre: function(scope, elements, attrs) {} }
        
        { post: function(scope, elements, attrs) {} }
        
        pre is before other directives have been replaced, so post is usually more common and useful.
        
        shorthand link: function(scope, elements, attrs) {} can be used at same level as compile. More common syntax. Same as post.
      - transclusion: include one doc in another
        
        <ng-transclude> in template
        
        then anything inside custom directive gets copied into template
  - - - Angular services (mostly singletons, $scope is an exception)
        
        $scope
        
        $log (nice colors in console)
        
        $filter
        
        $http (ajax)
        
        $location
        
        $routeParams
      - Add external services in app depency array.
        
        ngResources to for web services.
        
        ngMessage for form validation
        
        ngRoutes
        
        myApp.config(function($routeProvider) {})
        
        .when('/', { templateUrl: xx, controller: xx })
        
        .when('/edit/:num')
        
        $routeParams.num
      - Controller As (Angular 1.2)
        
        Don't use $scope, use this in controller
        
        ng-controller="parentController as parentVm" then use parentVm.message for interpolation
        
        Useful for nested controllers
    - - Can inject other services into service just like with controllers.