Angular js Público

Angular js

FREDYS  FERNANDEZ
Curso por FREDYS FERNANDEZ, actualizado hace más de 1 año Colaboradores

Descripción

Curso de conocimientos angular

Información de los módulos

Sin etiquetas
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>
Mostrar menos
Sin etiquetas
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 "; });
Mostrar menos
Sin etiquetas
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){   });
Mostrar menos
Sin etiquetas
Two way data binding y bg model
Mostrar menos
Sin etiquetas
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
Mostrar menos
Sin etiquetas
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}}                   "
Mostrar menos
Sin etiquetas
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>
Mostrar menos
Mostrar resumen completo Ocultar resumen completo