Angular js Public

Angular js

FREDYS  FERNANDEZ
Course by FREDYS FERNANDEZ, updated more than 1 year ago Contributors

Description

Curso de conocimientos angular

Module Information

No tags specified
Angular Software  general que puede ser selectivamente modificado por codigo adicional por el usuario para crear software especifíco. Directivas Grupos de codigo que extienden las capacidades de HTML Lista de directivas ng-app : Indica que tiene una aplicación de angular Ejemplo "Hola mundo" con Angular js <!DOCTYPE html> <html ng-app>   <head>     <meta charset="utf-8">     <title>Hola Mundo con Angular JS</title>     <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.32/angular.min.js">     </script>   </head>   <body>           {{"Hola " + "Mundo"}}   </body> </html>
Show less
No tags specified
Controladores Ejemplos de controladores Archivo HTML (index.html) "          Hola controller con Angular JS                       {{"Hola " + nombre}}   "              Archivo JS (controller.js) var app = angular.module("MyFirstApp",[]); app.controller("FirstController", function($scope){        $scope.nombre = "Fredy Fernandez "; });
Show less
No tags specified
Módulos Para agregar un nuevo modulo debemos llamar la librería (angular.module). El primer parámetro que recibe es el nombre del modulo, el segundo parámetro que recibe son los módulos de los que dependen el módulo que nosotros estamos creando. ngResource : Con este modulo podremos crear un objeto reffull que se pueda comunicar un API que REST Por ejemplo Archivo JS (controller.js) angular.module("MyFirstApp",[]); .controller("FirstController", function($scope){        $scope.nombre = "Fredy Fernandez "; }).controller("SecondController". function($scope){   });
Show less
No tags specified
Two way data binding y bg model
Show less
No tags specified
Dependency Injection EJemplo  var app = angular.module("MyFirstApp",[]); app.controller("FirstController", function($scope){         $scope.nombre = "Fredy Fernandez ";        $scope.dateDay= "03/08/2017"        $scope.nuevoComentario = {};        $scope.comentarios = [            {                    comentario: "Buen Tutorial",                    username: "Fredy Fernandez",                    dateDay: "03/08/2017"                                },            {                    comentario: "Malisimo Tutorial",                    username: "Jose Carrasxo",                    dateDay: "03/08/2017"            }        ];        $scope.agregarComentarios = function(){                $scope.comentarios.push($scope.nuevoComentario);                $scope.nuevoComentario = {};        } });   $scope es una Dependencia
Show less
No tags specified
Archivo js (controller.js) var app = angular.module("MyFirstApp",[]); app.controller("FirstController",function($scope, $http){       $scope.posts = [];       $scope.newPost = {};       $http.get("http://jsonplaceholder.typicode.com/posts")              .success(function(data){                      console.log(data);                      $scope.posts = data;              })              .error(function(err){              });       $scope.addPost = function(){               $http.post("http://jsonplaceholder.typicode.com/posts",{                       title: $scope.newPost.title,                       body: $scope.newPost.body,                       userId: 1                 })              .success(function(data, status, headers, config){                  $scope.posts.push($scope.newPost);                  $scope.newPost = {};              })              .error(function(error,status, headers, config){                  console.log(error);              });       } });   Arhcivo HTML (index.html "          Hola controller con Angular JS                                Enviar Datos                                {{ post.title}}           {{ post.body}}                   "
Show less
No tags specified
Archivo js angular.module("ToDoList",["LocalStorageModule"]) .controller("ToDoController", function($scope, localStorageService){     if (localStorageService.get("angular-todoList")) {         $scope.todo = localStorageService.get("angular-todoList");     }else {         $scope.todo = [];     }     $scope.$watchCollection("todo",function(newValue, oldValue){         localStorageService.set("angular-todoList",$scope.todo);     })          $scope.AddActividad = function(){         $scope.todo.push($scope.newActividad);         $scope.newActividad = {};     }     $scope.clearActividad = function(){         $scope.todo = [];     } });   Archivo html <!DOCTYPE html> <html ng-app="ToDoList">   <head>     <meta charset="utf-8">     <title>Hola controller con Angular JS</title>     <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.32/angular.min.js"></script>     <script src="controller.js"></script>     <script src="angular-local-storage.min.js"></script>   </head>   <body ng-controller="ToDoController">         <ul>             <li ng-repeat="Actividad in todo">                 {{Actividad.descripcion}} -                 {{Actividad.fecha | date: 'short'}}                         </li>         </ul>         <form ng-submit="AddActividad()">             <input type="text" ng-model="newActividad.descripcion">             <br><br>             <input type="datetime-local" ng-model="newActividad.fecha">             <br><br>             <input type="submit" value="Guardar actividad">             <button ng-click="clearActividad()">Limpiar</button>         </form>   </body> </html>
Show less
Show full summary Hide full summary