Директива AngularJS используется для расширения HTML. Все это особые свойства, начиная с префикса. Мы обсудим следующие директивы:
NG -APP - эта директива запускает приложение AngularJS.
ng -init - эта директива инициализирует данные приложения.
NG -Model - Эта директива определяет модель, которая является переменной, используемой в AngularJS.
NG -Repeat - Эта директива будет повторять HTML -элементы для каждого элемента в коллекции.
команда NG-APP
Директива NG-APP начинает приложение AngularJS. Он определяет корневой элемент. Он автоматически инициализирует или запускает приложение, которое загружает веб -страницы приложения AngularJS. Он также используется для загрузки различных модулей AngularJS AngularJS. В следующем примере мы определяем приложение AngularJS по умолчанию, используя атрибут NG-App элемента DIV.
<div ng-app = ""> ... </div>
NG-INIT Директива
Директива NG-INIT инициализирует данные приложения AngularJS. Он используется для размещения значений в приложение для использования переменных. В следующем примере мы будем инициализировать массив стран. Используйте синтаксис JSON, чтобы определить массивы стран.
<div ng-app = "" ng-init = "ouns = [{locale: 'en-us', имя: 'Соединенные Штаты'}, {locale: 'en-gb', имя: 'Великобритания'}, {locale: 'en-fr', имя: 'france'}]"> ... </div>NG-модель команда
Директива NG-модели определяет модели/переменные, используемые в приложениях AngularJS. В следующем примере мы определяем модель под названием «Имя».
<div ng-app = ""> ... <p> Введите свое имя: <input type = "text" ng-model = "name"> </p> </div>
NG-Repeat Directive
Директива NG-Repeat повторяет каждый элемент в коллекции элементов HTML. В следующем примере мы итерационные страны.
<div ng-app = ""> ... <p> Список соотечественников с локали: </p> <ol> <li ng-repeat = "Страна в странах"> {'' Country: ' + country.name +', locale: ' + country.locale}} </li> </ol> </div>пример
В следующих примерах будут показаны все вышеперечисленные инструкции.
testangularjs.html
<html> <title> Директивы angularjs </title> <body> <h1> применение приложения </h1> <div ng-app = "" ng-init = "Страны = [{locale: 'en-us', name: 'Соединенные Штаты'}, {locale: 'en-gb, name:' United '}, {locale:' in-fram Ваше имя: <input type = "text" ng-model = "name"> </p> <p> hello <span ng-bind = "name"> </span>! </p> <p> Список стран с локацией: </p> <ol> <li ng-repeat = "Страна в странах"> {'' Country. </ol> </div> <script src = "http://ajax.googleapis.com/ajax/libs/angularjs/1.2.15/angular.min.js"> </script> </body> </html>Выход
Откройте TextAngularjs.html в веб -браузере. Введите свое имя и посмотрите следующие результаты.
Выше всего является основной информацией директивы AngularJS. Мы будем продолжать добавлять соответствующую информацию в будущем. Спасибо за вашу поддержку на этом сайте!