Latest web development tutorials

AngularJS Введение

AngularJS является основой JavaScript. Он может быть добавлен в HTML-страницы с помощью тега <скрипт>.

AngularJS по директиве расширяет HTML, и через выражение привязки данных к HTML.

AngularJS является основой JavaScript

AngularJS является основой JavaScript. Это библиотека, написанная в JavaScript.

Файл AngularJS JavaScript является форма выпуска может быть добавлен тег сценария на странице:

<Script SRC = "http://cdn.static.w3big.com/libs/angular.js/1.4.6/angular.min.js"> </ скрипт>

примечание Мы предлагаем сценарий на нижней части элемента <тела>.
Это позволит увеличить скорость загрузки страницы, так как HTML не подлежит загрузке скрипт для загрузки.

Каждая angular.js версия скачать: https://github.com/angular/angular.js/releases

AngularJS расширяет HTML

AngularJS Нг директив расширенный HTML.

Директива нг-приложение определяет AngularJS приложение.

нг-модель команды значения элемента (например, значение поля ввода) , связанного с приложением.

Команда нг-связывания для связывания данных приложения с точки зрения HTML.

AngularJS примеры

<! DOCTYPE HTML>
<HTML>
<Head>
<Meta Charset = "UTF-8 ">
<Script SRC = "http://cdn.static.w3big.com/libs/angular.js/1.4.6/angular.min.js"> </ скрипт>
</ Head>
<Body>

<Div нг-приложение = "" >
<P> Имя: <тип входного = "текст" нг-модель = "имя"> </ p>
<H1> Здравствуйте , {{имя} } </ h1>
</ Div>

</ Body>
</ HTML>

Попробуйте »

Примеры объяснить:

При загрузке страницы, AngularJS автоматически.

Директива нг-приложение сообщает AngularJS, элемент <DIV> является AngularJS применение "владельца" .

Директива нг-модель связывает значение поля ввода имени переменной приложения.

Команда нг-привязку к имени переменной приложения связан с пунктом innerHTML.

примечание Если вы удалите директиву нг-приложение, HTML будет отображаться непосредственно в выражении, а не оценивать выражение результатов.

Что такое AngularJS?

AngularJS делает развитие современного одной страницы приложения (ООР: отдельные приложения страницы) проще.

  • AngularJS данные приложения связываются с HTML элементы.
  • AngularJS HTML элементы могут быть клонированы и повторить.
  • AngularJS могут скрывать и показывать HTML элементы.
  • AngularJS может добавить код в HTML-элемент "за".
  • AngularJS поддерживают проверку входных данных.

AngularJS директивы

Как вы можете видеть, AngularJS команда приставкой атрибуты HTML нг.

Команда нг-инициализации для инициализации AngularJS переменных приложения.

AngularJS примеры

<div ng-app="" ng-init="firstName='John'">

<p>姓名为 <span ng-bind="firstName"></span></p>

</div>

Попробуйте »

примечание HTML5 позволяет расширить имущество (домашнее) к данные- начала.
AngularJS свойство ng- начало, но вы можете использовать данные-ng- , чтобы сделать веб - страниц для HTML5 действительным.

С действительным HTML5:

AngularJS примеры

<div data-ng-app="" data-ng-init="firstName='John'">

<p>姓名为 <span data-ng-bind="firstName"></span></p>

</div>

Попробуйте »

AngularJS выражение

AngularJS выражения , написанные в фигурные скобки: {{выражение}}.

AngularJS выражение для связывания данных в HTML, который команда нг-привязки имеет ту же цель.

AngularJS выражение в записи данных о местоположении "выходных".

AngularJS выражения типа выражений JavaScript: они могут содержать текст, операторы и переменные.

Примеры 5 + 5 {{}} или {{FirstName + "" + LastName}}

AngularJS примеры

<! DOCTYPE HTML>
<HTML>
<Head>
<Meta Charset = "UTF-8">
<Script SRC = "http://cdn.static.w3big.com/libs/angular.js/1.4.6/angular.min.js"> </ скрипт>
</ Head>
<Body>

<Div нг-приложение = "">
<P> Мое первое выражение: {{5 + 5}} </ p>
</ Div>

</ Body>
</ HTML>

Попробуйте »

AngularJS Применения

AngularJS модуль (модуль) определяет AngularJS приложений.

AngularJS Контроллеры (Controller) для управления AngularJS приложений.

Директива нг-приложение определяет приложение, нг-контроллер определяет контроллер.

AngularJS примеры

<DIV нг-приложение = "MyApp " нг-контроллер = "myCtrl">

Имя: <входной тип = "текст" нг-модель = "FirstName"> <br>
Фамилия: <входной тип = "текст" нг-модель = "LastName"> <br>
<br>
Имя: {{FirstName + "" + LastName}}

</ Div>

<Script>
вар приложение = angular.module ( 'MYAPP' , []);
app.controller ( 'myCtrl', функция ( $ сфера) {
$ Scope.firstName = "Джон";
$ Scope.lastName = "Doe";
});
</ Script>

Попробуйте »

AngularJS определения модуля приложения:

AngularJS модуль

вар приложение = angular.module ( 'MYAPP', []);

AngularJS приложений контроллера:

AngularJS Контроллеры

app.controller ( 'myCtrl', функция ($ сфера) {
$ Scope.firstName = "Джон";
$ Scope.lastName = "Doe";
});

В следующем уроке вы узнаете больше знаний и прикладных модулей.