JSFiddle

  • advanced-TODO-$resource

    Caricamento TODO con $resource

    var myapp = angular.module('myapp', ['ngResource']);
    
    myapp.controller('TodoController', 
           ['$scope', '$rootScope', 'TodoService', 
    function($scope, $rootScope, TodoService) {
      $scope.TodoService = TodoService;
      $rootScope ...
  • adv-directive-transclusion

    No-Library (pure JS), HTML, CSS, JavaScript

    var myApp = angular.module('myApp',[]);
    
    function MyCtrl($scope) {
        $scope.log=[];   
    }
    
    myApp.directive('myDirective', function(){
    	return{
    		transclude: true,
    		template: '<div class="something" ng-transclude> This is ...</div>
  • adv-directive-components

    No-Library (pure JS), HTML, CSS, JavaScript

    var NameComponent = {
    	bindings: {
      	name: '=',
        age: '='
      },
      template: [
      	'<div>',
        	'<p>Name: {{$ctrl.name}}</p>',
          '<p>Age: {{$ctrl.age}}</p>',
        '</div>'
      ].join('')
    };
    
    function MainController() {
    	this.people = [{
      	name: 'Todd',
        age ...
  • base-03-controllers #3 is the latest revision

    No-Library (pure JS), HTML, CSS, JavaScript

    var myapp = angular.module('myapp', []);
    myapp.controller('FirstController', function($scope) {
    	$scope.funz = 
      $scope.funz = function() {
       $scope.name = 'first!'
      
      };
    
    });
    
    myapp.controller ...
  • advanced-TODO-$resource

    Caricamento TODO con $resource

    var myapp = angular.module('myapp', ['ngResource']);
    
    myapp.controller('TodoController', 
           ['$scope', '$rootScope', 'TodoService', 
    function($scope, $rootScope, TodoService) {
      $scope.TodoService = TodoService;
      $rootScope ...
  • advanced-interpolate

    No-Library (pure JS), HTML, CSS, JavaScript

    var myapp = angular.module('myapp', []);
    myapp.controller('MyController',
      function($scope, $interpolate) {
        $scope.to = 'info@example.com';
        $scope.emailBody = 'Ciao {{ to ...
  • directive-two-way-binding

    Directive as attribute with two-way binding

    var myapp = angular.module('myapp', []);
    
    myapp.directive('myDirective', function() {
      return {
        restrict: 'A',
        replace: true,
        scope: {
            myUrl: '@',     // binding strategy COPY VALUE ...
  • directive-attribute-with-params

    Directive as attribute with params

    var myapp = angular.module('myapp', []);
    
    myapp.directive('myDirective', function() {
      return {
        restrict: 'A',
        replace: true,
        scope: {
            myUrl: '@',     // binding strategy COPY VALUE ...
  • directive-first

    My first directive

    var myapp = angular.module('myapp', []);
    
    myapp.directive('myDirective', function() {
      return {
        restrict: 'E',
        template: '<a href="http://www.example.com/">Click me to go to EXAMPLE</a>'
      }
    });
  • base-TODO-login

    Esempio con login per accedere alla lista TODO e caricamento dati ajax

    var myapp = angular.module('myapp', []);
    
    myapp.controller('Container', function($scope, $rootScope) {
      $scope.loginVisible = true;
      $scope.todoVisible = false;
      $rootScope.$on('loggedUser ...