La directiva AngularJS se usa para extender HTML. Todas estas son propiedades especiales que comienzan con el prefijo NG. Discutiremos las siguientes directivas:
NG -APP: esta directiva inicia una aplicación AngularJS.
Ng -Init: esta directiva inicializa los datos de la aplicación.
Modelo NG: esta directiva define un modelo que es una variable utilizada en AngularJS.
Ng -Repeat: esta directiva repetirá elementos HTML para cada elemento de la colección.
comando ng-app
La Directiva NG-APP inicia una aplicación AngularJS. Define el elemento raíz. Inicializa o inicia automáticamente una aplicación que carga las páginas web de la aplicación AngularJS. También se usa para cargar varios módulos AngularJS Aplicaciones AngularJS. En el siguiente ejemplo, definimos la aplicación AngularJS predeterminada utilizando el atributo NG-APP del elemento DIV.
<div ng-app = ""> ... </div>
Directiva de In-Init
La Directiva de INIT NG inicializa los datos de una aplicación AngularJS. Se utiliza para poner valores en la aplicación para usar variables. En el siguiente ejemplo, inicializaremos la matriz de los países. Use la sintaxis JSON para definir las matrices de países.
<Div ng-app = "" ng-init = "países = [{locale: 'en-us', nombre: 'Estados Unidos'}, {locale: 'en-gb', nombre: 'Reino Unido'}, {locale: 'en-fr', nombre: 'Francia'}]"> ... </div>comando ng-model
La Directiva NG-Model define modelos/variables utilizados en aplicaciones AngularJS. En el siguiente ejemplo, definimos un modelo llamado "nombre".
<div ng-app = ""> ... <p> Ingrese su nombre: <input type = "text" ng-model = "name"> </p> </div>
Directiva Ng-Repeat
La directiva NG-Repeat repite cada elemento en la colección de elementos HTML. En el siguiente ejemplo, hemos iterado sobre los países de la matriz.
<Div ng-app = ""> ... <p> Lista de países con locales: </p> <ol> <li ng-depheat = "país en países"> {{'país:' + country.name + ', locale:' + country.locale}} </li> </ol> </div>ejemplo
Los siguientes ejemplos mostrarán todas las instrucciones anteriores.
testangularjs.html
<html> <title> AngularJS Directive </title> <body> <h1> Aplicación de muestra </h1> <div ng -pp = "" nginit = "países = [{locale: 'en-us', nombre: 'Estados Unidos'}, {locale: 'en-gb', nombre: 'Reino unido'}, {locale: 'en-frr', nombre: '' france '} Su nombre: <input type = "text" ng-model = "name"> </p> <p> hola <span ng-bind = "name"> </span>! </p> <p> Lista de países con locales: </p> <ol> <li ng-epeat = "país en los países"> {{{'país:' + country.name + ', locale:' + country.locale} </ol> </div> <script src = "http://ajax.googleapis.com/ajax/libs/angularjs/1.2.15/angular.min.js"> </script> </body> </html>Producción
Abra textangularjs.html en un navegador web. Ingrese su nombre y vea los siguientes resultados.
Lo anterior es la información básica de la Directiva AngularJS. Continuaremos agregando información relevante en el futuro. ¡Gracias por su apoyo a este sitio!