Простая структура index.html в angular.js:
<! Doctype html> <html ng-app> <head> <script src = "http://code.angularjs.org/angular-1.0.1.min.js"> </script> </head> <body> Ваше имя: <input = "text" ng-model = " || 'Мир'}}! </body> </html>
Свойство NG-App -это флаг-заявление Angular.js, которое отмечает объем Angular.js. NG-APP может быть добавлен во многих местах, как указано выше, к тегу HTML, что указывает на то, что угловой сценарий работает для всей страницы. Вы также можете добавить атрибут ng-app местно. Например, добавление NG-APP в определенное DIV это означает, что вся область DIV будет проанализирована с использованием угловых сценариев, в то время как угловые сценарии не будут проанализированы в других местах.
NG-модель означает создание модели данных. Здесь, в поле ввода в входном имени мы определяем модель данных YourName. После определения модели мы можем сделать вызовы ниже, используя {{}}. Это завершает привязку данных. Когда мы введем контент в поле ввода, он будет синхронизирован с блоком оператора Hello.
Модель данных, определенная NG-модели, может использоваться не только в приведенных выше сценариях, но также может широко использоваться во многих случаях.
1. Настройка фильтра для реализации функции поиска
В следующем коде мы можем завершить функцию поиска списка, используя простое определение модели данных + фильтр. (Это пример кода на китайском веб -сайте, поэтому не нужно быть неясным.)
<div> <div> <div> search: <input ng-model = "Query"> </div> <div> <ul> <li ng-repeat = "Телефон в телефонах | Фильтр: запрос"> {{телефон.В приведенном выше коде запрос модели данных связан с входной тегом окна поиска. Таким образом, информация, введенная пользователем, будет синхронизировать в модели данных запросов. В следующем LI используется фильтр: Query может реализовать функцию фильтрации данных в списке и фильтровать в соответствии с входной информацией пользователя.
2. Установите OrderBy для реализации функции сортировки списка
В следующем коде, например, Filter, используйте OrderBy, чтобы добавить функцию сортировки в список:
Поиск: <input ng-model = "query"> sort by: <select ng-model = "orderprop"> <vition value = "name"> алфавит </option> <vition value = "age"> новейшая </option> </select> <ul> <li ng-repeat = "Телефон в телефонах | Filter: Query | orderby: useprop"> {{Phone. <p> {{phone.snippet}} </p> </li> </ul>Выше приведено о методах использования NG-APP и NG-модели. Мы рассмотрим старое и изучаем новое. Я надеюсь, что каждый может что -то получить от этого.