Aquí un ejemplo de uso de Rutas (Routes) en AngularJS : codigo app.js var app = angular.module(“app”, [“ngRoute”]); app.config([‘$routeProvider’, function($routeProvider) { $routeProvider.when(“/rutas”, { templateUrl : “rutas.html”, controller : “rutas” }) .when(“/otrasrutas”, { templateUrl : “otrasrutas.html”, controller : “otrasrutas” }) .otherwise({ redirectTo : “/” }); }]); app.controller(‘rutas’, [‘$scope’, function($scope) { $scope.mensaje = “Mensaje desde rutas”; $scope.otrocontrolador […]
Angular JS
Ng-Repeat
<!DOCTYPE html> <html ng-app=”MyFirstApp”> <head> <meta charset=”utf-8″> <script src=”angular.min.js” type=”text/javascript”></script> <script src=”controller_http.js”></script> <title> Modelo en Scope</title> </head> <body ng-controller=”FirstController”> <input type=”text” ng-model=”newPost.title”><br> <textarea ng-model=”newPost.body”> </textarea> <button ng-click=”addPost()”>Enviar</button> <ul> <li ng-repeat=”post in posts”> <h2>{{post.title}}</h2> <p> {{post.body}} </p> </li> </ul> </body> </html> ————————— controller_http.js angular.module(“MyFirstApp”,[]) .controller(“FirstController”,function($scope,$http){ $scope.posts = []; $scope.newPost = {}; $http.get(“http://jsonplaceholder.typicode.com/posts”) .success(function(data){ console.log(data); $scope.posts […]
Controllers y Modules
<!DOCTYPE html> <html ng-app> <head> <meta charset=”utf-8″> <title> Cuaderno alumno </title> <link rel=”stylesheet” type=”text/css” href=”styles.css”> </head> <body ng-controller=”AlumnosController”> <h1> Cuaderno de alumnos </h1> <div class=”wrapper”> <div class=”contact-item” ng-repeat=”alumno in alumnos | orderBy :’nombre’”> <div class=”nombre”>{{alumno.nombre}} – {{alumno.telefono}} <span class=”curso”>{{alumno.curso}} </span> </div> </div> </div> <br/> <center><button ng-click=”ShowForm()” ng-hide=”formVisibility”>Agregar Contacto </button> </center> <div ng-show=”formVisibility” class=”wrapper”> <h2> Añadir […]
AngularJS Ejemplo Controller
<!DOCTYPE html> <html ng-app> <head> <meta charset=”utf-8″> <title> Modelo en Scope</title> </head> <body ng-controller=”AlumnoController”> {{alumno.nombre}} estudia {{alumno.curso}} <script src=”angular.min.js” type=”text/javascript”></script> <script type=”text/javascript”> function AlumnoController($scope){ $scope.alumno ={ nombre: “Marcelo “, curso: “angular” } } </script> </body> </html>
Tags AngularJS
Tags AngularJS Función Básica en AngularJS <!DOCTYPE html> <html ng-app> -> Esta etiqueta especifica que es una aplicación Angular. <body ng-controller=”AlumnoController”> ->Define un controlador llamao AlumnoController <script type=”text/javascript”> –>Mediante Scope Hace uso del manejo de los datos. function AlumnoController($scope){ $scope.alumno ={ nombre: “Marcelo “, curso: “angular” } } </script> <div class=”contact-item” ng-repeat=”alumno in alumnos | […]