La directiva ng-controller en AngularJS se usa para agregar un controlador a la aplicación. Se puede usar para agregar métodos, funciones y variables que se pueden llamar en algún evento como hacer clic, etc. para realizar cierta acción.
Sintaxis:
<element ng-controller="expression"> Contents... </element>
Donde expresión se refiere al nombre del controlador.
Ejemplo 1: este ejemplo utiliza la directiva ng-controller para mostrar los elementos de entrada.
<!DOCTYPE html>
<html>
<head>
<title>ng-controller Directive</title>
<script src=
"https://ajax.googleapis.com/ajax/libs/angularjs/1.4.2/angular.min.js">
</script>
</head>
<body ng-app="app" style="text-align:center">
<h1 style="color:green">GeeksforGeeks</h1>
<h2>ng-controller Directive</h2><br>
<div ng-controller="geek">
Name: <input class="form-control" type="text"
ng-model="name">
<br><br>
You entered: <b><span>{{name}}</span></b>
</div>
<script>
var app = angular.module('app', []);
app.controller('geek', function ($scope) {
$scope.name = "geeksforgeeks";
});
</script>
</body>
</html>
Producción:
Ejemplo 2: este ejemplo utiliza la directiva ng-controller para mostrar el contenido después de hacer clic en el botón.
<!DOCTYPE html>
<html>
<head>
<title>ng-controller Directive</title>
<script src=
"https://ajax.googleapis.com/ajax/libs/angularjs/1.4.2/angular.min.js">
</script>
</head>
<body ng-app="app" style="text-align:center">
<h1 style="color:green">GeeksforGeeks</h1>
<h2>ng-click Directive</h2>
<div ng-controller="app">
<button class="btn btn-default" ng-click="best()">
Button 1
</button>
<button class="btn btn-primary" ng-click="notbest()">
Button 2
</button><br>
<p>Quick sort is <b>{{res}}</b>.</p>
</div>
<script>
var app = angular.module('app', []);
app.controller('app', function ($scope) {
$scope.best = function () {
return $scope.res = "best";
};
$scope.notbest = function () {
return $scope.res = "not always good";
};
});
</script>
</body>
</html>
Salida:
Antes de hacer clic: 
Después de hacer clic en el Botón 2:
Publicación traducida automáticamente
Artículo escrito por Vishal Chaudhary 2 y traducido por Barcelona Geeks. The original can be accessed here. Licence: CCBY-SA