1. Какой механизм используется для привязки данных в Angular? Подробный принципиальный
ответ: грязный механизм проверки.
Анализ:
Двусторонняя привязка данных — один из основных механизмов AngularJS. При изменении каких-либо данных в представлении они будут обновлены в модели. При изменении данных в модели представление также будет обновляться синхронно. Очевидно, это требует мониторинга. [Рекомендация по соответствующему учебнику: «Учебное пособие по Angular»]
Принцип заключается в том, что Angular устанавливает очередь прослушивания в модели области для отслеживания изменений данных и обновления представления. Каждый раз, когда вы привязываете что-то к представлению, AngularJS вставляет $watch в очередь $watch, чтобы определить, есть ли изменения в модели, которую он отслеживает. Когда браузер получает событие, которое может быть обработано контекстом Angular, запускается цикл $digest, проходящий через все $watches и, наконец, обновляющий dom.
2. Как реализована двусторонняя привязка данных в AngularJS?
Ответ:
1. У каждого двустороннего связанного элемента есть наблюдатель.
2. При возникновении определенных событий вызывается дайджест обнаружения грязных данных.
К таким событиям относятся: изменение содержимого элементов формы, ответы на Ajax-запросы, функции, выполняемые при нажатии кнопок и т. д.
3. Обнаружение грязных данных обнаружит все элементы-наблюдатели в корневой области.
Функция $digest предназначена для мониторинга грязных данных
. 3. Какие сторонние плагины вы использовали при разработке проекта angularjs.
Ответ: AngularUi ui-router oclazyload и т. д. Прикреплена статья для более детального ознакомления https://segmentfault. com/a/1190000003858219
4. В чем разница между ng-show/ng-hide и ng-if?
Ответ: Мы все знаем, что ng-show/ng-hide на самом деле скрывается и отображается через display. А ng-if фактически управляет добавлением и удалением узлов dom. Следовательно, если мы загружаем dom-узлы на основе разных условий, то производительность ng-if лучше, чем ng-show.
5. Объясните, что такое root Scrope и чем он отличается от rootScrope, rootScrope и Scope?
Ответ: С точки зрения непрофессионала, корневая страница Scrope является отцом всех страниц rootScrope, всех страниц rootScrope и всех областей.
Анализ:
Давайте посмотрим, как генерировать корневую S-копию, rootScope, rootScope и область.
шаг 1: Angular анализирует ng-app и создает в памяти $rootScope.
шаг 2: angular продолжает анализ, находит выражение {{}} и преобразует его в переменную.
шаг 3: Затем div с ng-controller будет проанализирован и указан на функцию контроллера. В это время функция контроллера становится экземпляром объекта $scope.
6. Назовите хотя бы три способа реализации связи между разными модулями?
Ответ:
7. Выражение { Как работает {yourModel}}?
Ответ:
Он использует службу $interpolation. После инициализации html страницы он найдет эти выражения и пометит их, поэтому каждый раз, когда он сталкивается с {. {}}, $watch будет установлен. И $interpolation вернет функцию с параметрами контекста. Когда функция наконец будет выполнена, к этой области будет применено выражение $parse.
8. $http в Angular
Ответ: $http — это основная служба AngularJS, используемая для чтения данных с удаленных серверов.
Мы можем использовать встроенную службу http для прямой связи с внешним миром. Служба http напрямую взаимодействует с внешним миром. Служба http напрямую взаимодействует с внешним миром. Служба http просто инкапсулирует собственный объект XMLHttpRequest браузера.
9. Когда ng-repeat перебирает массив, если в массиве есть одинаковые значения, что произойдет и как это решить?
Ответ: Будет выдано сообщение о том, что дубликаты в репитере не разрешены. Для решения проблемы добавьте трек по $index. Конечно, вы также можете отслеживать любое обычное значение, если оно может однозначно идентифицировать каждый элемент в массиве (установить связь между dom и данными).
10. Ответ рамки angularjs mvc или mvvm
:анализ
mvvm
:сначала уточните. Вот ваш понимание mvc и mvvm:
Прежде всего, зачем нам MVC? Потому что по мере того, как размер кода становится все больше и больше, разделение обязанностей становится общей тенденцией, и для удобства последующего обслуживания изменение одной функции не влияет на другие функции. И для повторного использования, потому что большая часть логики та же самая. MVC — это всего лишь средство, конечная цель — модульность и повторное использование.
Преимущества mvvm
заключаются в низкой связанности: представление можно изменять и модифицировать независимо от модели, одну и ту же модель представления можно повторно использовать в нескольких представлениях, а изменения в представлении и модели можно вносить независимо друг от друга:
можно использовать некоторую логику представления
;Размещенные в ViewModel, несколько представлений можно повторно использовать;
независимая разработка: разработчики могут сосредоточиться на разработке бизнес-логики и данных (ViewModemvvmdi; дизайнеры могут сосредоточиться на разработке пользовательского интерфейса (представление);
тестируемость: четкое многоуровневое представление позволяет это сделать. проще и проще протестировать бизнес-логику уровня представления.
В angular шаблон MVVM в основном разделен на четыре части:
Представление: он фокусируется на отображении и рендеринге интерфейса. Вangular
он содержит множество декларативных представлений Directive. шаблоны
: это связующее звено между представлением и моделью, отвечающее за взаимодействие и сотрудничество между представлением и моделью. Оно отвечает за предоставление отображаемых данных в представление и предоставление возможности командному событию в представлении управлять моделью. объект $scope служит для этого. Роль ViewModel;
Это носитель инкапсуляции данных, связанных с бизнес-логикой приложения. Это объект в бизнес-домене. Модель не заботится о том, как она будет отображаться или. работает, поэтому модель не будет содержать никакой информации, связанной с отображением интерфейса. На веб-страницах большинство моделей возвращают данные с сервера Ajax или являются объектами глобальной конфигурации, а служба в angular — это место для инкапсуляции и обработки бизнес-логики. связанный с моделью. Служба — это служба домена, которая может повторно использоваться несколькими контроллерами или другими службами.
Контроллер: это не основной элемент шаблона MVVM, но он отвечает за инициализацию объекта ViewModel. Он объединяет одну или несколько служб для получения объекта ViewModel бизнес-домена, чтобы интерфейс приложения достигал пригодного для использования состояния при запуске.
Интерфейс mvc тесно связан с логикой, и данные считываются непосредственно из него. Интерфейс mvvm слабо связан с режимом просмотра, а данные интерфейса получаются из модели представления. Поэтому angularjs предпочитает mvvm
11.
Какие роли $scope, контроллер, директива и служба играют в mvvm в angularjs?
Если вы не знаете, анализ первого вопроса очень понятен, прочтите внимательно еще раз
12. В angular Как вы контролируете разумную загрузку статических ресурсов в проекте
Ответ: Нет
13. Что вам нужно заплатить. на что обратить внимание при написании логики контроллера?
Ответ:
1. Упростить код (это то, что должны иметь все разработчики)
2. Решительно не иметь возможности управлять dom-узлом. Вы можете спросить, почему бы и нет.
Ваш ответ: DOM-операции могут появляться только в директивах. Последнее место, где оно должно появиться, — это сервис. Angular поддерживает разработку через тестирование. Если операции DOM появляются в сервисе или контроллере, это означает, что тест не может быть пройден. Конечно, это всего лишь один момент. Что важно, так это одно из преимуществ использования Angular, которое представляет собой двустороннюю привязку данных, так что вы можете сосредоточиться на обработке бизнес-логики, не занимаясь множеством операций DOM. Если код Angular по-прежнему полон различных DOM-операций, то почему бы не использовать jquery непосредственно для разработки.
Что такое разработка через тестирование? Для популяризации:
разработка через тестирование, полное английское название — разработка через тестирование, или сокращенно TDD, — это новый метод разработки, который отличается от традиционного процесса разработки программного обеспечения. Он требует написания тестового кода перед написанием кода для определенной функции, а затем только написания функционального кода, который обеспечивает прохождение теста, и проведения всей разработки через тестирование. Это помогает писать краткий, удобный и высококачественный код и ускоряет процесс разработки.
14.
Ответы на вопросы, как взаимодействовать между контроллерами:
1.
Здесь есть два метода для события: один —scope.scope.scope.emit, а затем получает параметры, прослушивая событие root S, другой — событие; rootScope для получения параметров. ; Другой — событие rootScope для получения параметров; другой — rootScope.broadcast, который получает параметры, прослушивая широковещательную рассылку и прослушивая события области.
В последней версии Angular нет разницы в производительности. Основная причина в том, что направление отправки событий может быть разным.
2. Сервис
может создать выделенный Сервис событий, а может быть разделен по бизнес-логике и хранить данные в соответствующем Сервисе.
3.
Метод $rootScope может быть немного грязным, но он более удобен, т.е. данные хранятся в корневой области S, так что в каждой подкорневой области, то есть в каждой подкорневой области, так что можно вызвать каждую подобласть, но вам нужно обратить внимание на жизненный цикл
4. Непосредственно использовать область .scope.scope.$nextSibling и подобные свойства
. Аналогичны .scope.scope.parent. У этого метода больше недостатков. Официально не рекомендуется использовать какие-либо атрибуты, начинающиеся с $$, что не только увеличивает связанность, но и требует решения асинхронных проблем, а порядок областей не фиксирован.
В современных браузерахне рекомендуется
передавать параметры через локальное хранилище, глобальные переменные или postMessage. Если нет особых обстоятельств, избегайте этого метода.
15. Несколько параметров пользовательских инструкций
. Ответ:
Давайте поговорим о нескольких часто используемых, таких как:
Ограничить: форма объявления инструкции в
шаблоне dom E (элемент) A (атрибут) C (имя класса) M (комментарий): две формы. Тип текста HTML; функция, которая принимает два параметра: tElemetn и tAttrs и возвращает строку, представляющую шаблон. Строка шаблона должна иметь корневой элемент DOM
templateUrl: две формы: одна представляет собой строку, представляющую путь к внешнему файлу HTML, которая может принимать два параметра (параметры — tElement и tAttrs) и возвращает символы внешнего HTML; путь к файлу. Строковая
компиляция (объект или функция): параметр компиляции может возвращать объект или функцию. Если функция компиляции установлена, это означает, что мы хотим выполнять операции DOM до того, как инструкции и данные реального времени будут помещены в DOM. Выполнять операции DOM, такие как добавление и удаление узлов, в этой функции безопасно. По сути, когда мы устанавливаем параметр ссылки, мы фактически создаем функцию ссылки postLink(), чтобы функция compile() могла определить функцию ссылки.
Затем есть портал: http://www.cnblogs.com/mliudong/p/4180680.html
Разница между компиляцией и ссылкой:
при компиляции компиляция преобразует dom и сначала сохраняет его, когда обнаруживает место, где находится прослушиватель. Некоторые из них сохраняются, и, наконец, они суммируются в функцию связи и выполняются вместе, что повышает производительность.
16. Ответ на разницу между angular и jquery
:
angular основан на data-driven, поэтому angular подходит для проектов со сложными операциями с данными (здесь можно еще раз упомянуть одностраничные приложения, если вы не знаете, как это делать). преимущества здесь снова http://www.zhihu.com/question/20792064)
jquery основан на драйвере dom. jquery подходит для проектов с множеством операций dom.
17. Насколько хорошо вы знаете о форме form. angular?
Ответ:
Angular расширил тип элементов ввода и предоставляет в общей сложности следующие 10 типов:
текст,
URL
,
электронной
почты
флажок,
скрытая
кнопка
, отправить
сброс.
Angular имеет 4 встроенных стиля CSS для формы.
ng-valid проверяет допустимое состояние.
ng-invalid проверяет незаконное состояние.
ng-pristine. Если вы хотите использовать собственную форму, вам необходимо установить это значение
. ng-dirty Форма находится в состоянии «грязных данных»,
когда Angular проверит модель
.автоматическая проверка формы. Если ng-model не установлена, Angular не может узнать, истинно ли значение myForm.$invalid.
В содержимом, необходимом для проверки,
указывается, следует ли вводить контент
ng-maxlength, максимальная длина
ng-minlength, минимальная длина.
Пример: Портал https://github.com/18500047564/clutter
18. Что такое фильтр? Реализуйте ответ настраиваемого фильтра
:
дата (дата)
валюта (валюта)
limitTo (ограничить длину массива или строки)
orderBy (сортировка)
строчные (строчные)
прописные (прописные)
число (отформатируйте число, добавьте разделитель тысяч и получите параметры ограничивают количество десятичных знаков)
filter (обработка массива, отфильтровывание элементов, содержащих определенную подстроку)
json (форматирование объекта json)
Существует два способа использования фильтра,
один из них находится непосредственно на странице:
<p>{{now | date: 'гггг-ММ-дд'}</p> Другой вариант — использовать его в js:
$filter('имя фильтра')(объект для фильтрации, параметр 1, параметр 2,...)
$filter('date')(now, 'гггг-ММ-дд чч:мм:сс'); Настройте массив дедупликации
app.filter("unique", function() {
возвращаемая функция (прибытие) {
вар п = [];
вар объект = {};
for (var i = 0; i <arr.length; i++) {
если (!obj[arr[i]]) {
n.push(arr[i]);
объект[arr[i]] = 1;
}
}
вернуть н;
};
});