¡Esta es una revisión vieja del documento!
Hemos visto como indicando un mensaje en el $scope
podemos mostrarlo fácilmente en el HTML mediante {{ }}
. Pero la gracia de angular es que si modificamos el mensaje se actualiza automáticamente el HTML. Para poder cambiar el mensaje debemos incluir una nueva directiva llamada ng-click
que permite ejecutar una función JavaScript al pulsar sobre un elemento HTML.
El HTML ahora quedaría así:
<!DOCTYPE html> <html ng-app="app"> <head> <script src="//ajax.googleapis.com/ajax/libs/angularjs/1.2.19/angular.min.js"></script> <script src="script.js"></script> </head> <body ng-controller="PruebaController"> <h1>{{mensaje}}</h1> <button ng-click="cambiarMensaje()">Cambio</button> </body> </html>
var app=angular.module("app",[]); function PruebaController($scope) { $scope.mensaje="Hola Mundo"; $scope.cambiarMensaje=function() { $scope.mensaje="Dios mundo cruel :-)"; } }