Что подразумевается под загрузкой в angular JS?

Я новичок в угловой JS. Я проходил по ссылке ниже.
http://docs.angularjs.org/tutorial/step_00



Что такое файлы начальной загрузки? Где они находятся?



Что такое автоматическая загрузка и ручная инициализация начальной загрузки? Я прочитал недостаток ручной инициализации, как показано ниже.. по ссылке http://docs.angularjs.org/guide/bootstrap



может кто-нибудь объяснить точно в чем здесь недостаток?

558   6  

6 ответов:

хотя все выше ответили отлично, и я нашел то, что искал, но все еще рабочий пример кажется отсутствующим.

хотя понимание автоматической / ручной загрузки в AngularJS ниже примеров может помочь много :

AngularJS: Автоматическая Загрузка:

Angular инициализирует / bootstraps автоматически на DOMContentLoaded событии или когда угловой.скрипт js загружается в браузер и документ.readyState is установите для завершения. На этом этапе AngularJS ищет директиву ng-app. Когда директива ng-app будет найдена, то Angular будет:

  1. загрузить модуль, связанный с директивой.

  2. создать инжектор приложений.

  3. скомпилируйте DOM, начиная с корневого элемента ng-app.

этот процесс называется автоматической загрузкой.

<html>

    <body ng-app="myApp">
        <div ng-controller="Ctrl">Hello {{msg}}!</div>
        <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.4.5/angular.min.js"></script>
        <script>
            var app = angular.module('myApp', []);
            app.controller('Ctrl', function($scope) {
                $scope.msg = 'Nik';
            });
        </script>
    </body>

</html>

JSFiddle : http://jsfiddle.net/nikdtu/ohrjjqws/

AngularJS-Ручная Загрузка:

вы можете вручную инициализировать свое угловое приложение с помощью angular.начальной загрузки (функция). Эта функция принимает модули как параметры и должна быть вызвана в пределах углового.элемент(документ).готовые (функция). Угловатый.элемент(документ).функция ready () запускается, когда DOM готов к манипуляции.

<html>

    <body>
        <div ng-controller="Ctrl">Hello {{msg}}!</div>
        <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.4.5/angular.min.js"></script>
        <script>
            var app = angular.module('myApp', []);
            app.controller('Ctrl', function($scope) {
                $scope.msg = 'Nik';
            }); 
            //manual bootstrap process 
            angular.element(document).ready(function () { angular.bootstrap(document, ['myApp']); });
        </script>
    </body>

</html>

JSFiddle : http://jsfiddle.net/nikdtu/umcq4wq7/

Примечание :

  1. вы не должны использовать директиву ng-app при ручной загрузке ваше приложение.

  2. вы не должны смешивать автоматический и ручной способ ваше приложение.

  3. определите модули, регулятор, обслуживания etc. прежде чем вручную загрузка вашего приложения, как определено выше образцы.

ссылки : http://www.dotnettricks.com/books/angularjs/interview

27  
2017-06-01 22:20:21

Bootstrapping-это эквивалент инициализации или запуска вашего углового приложения. Есть 2 основных способа сделать это.

первый автоматически загружается путем добавления ng-app к элементу an в вашем HTML, например:

<html ng-app="myApp">
...
</html>

вторым было бы загрузиться из JavaScript, например, после создания вашего приложения через angular.module("myApp", []);

angular.bootstrap(document, ['myApp']);
52  
2015-08-30 15:42:50

добавление к ответу Дэйва Сверски (и я новичок в Angular, поэтому поправьте меня, если я ошибаюсь):

следующее изображение, взятое из angularjs.org bootstrap учебник. Объясняет, что Дэйв сформулировал.

enter image description here

HTML, внутри элемента с директивой ng-app, компилируется AngularJS. Например:

<body>
    <div> {{ 1 + 2 }} </div>
</body>

будет отображаться так:

{{ 1 + 2 }}

однако, добавление ng-app директива:

<body ng-app="module">
    <div> {{ 1 + 2 }} </div>
</body>

оказывает такой:

3

Это потому, что ng-приложение "загрузило" тег body и сказало Angular создать "внутреннее представление" контента. Внутреннее представление-это, конечно, 3. Из учебника:

" если директива ng-app найдена, то Angular скомпилирует DOM рассматривая директиву ng-app как корень компиляции. Этот позволяет сказать, что это лечить только часть в дом как угловой приложение."

Angular также загружает модуль, связанный с директивой ng-app ("модуль" в учебнике Angular), и создает инжектор приложения (используемый для инъекции зависимостей).

19  
2014-06-08 02:44:42

The ng-app директива указывает, какая часть страницы (все или часть, до вас) является корнем углового приложения. Angular считывает HTML внутри этого корня и компилирует его во внутреннее представление. Это чтение и компиляция является процессом начальной загрузки.

ручная загрузка - это когда вы пишете код для выполнения процесса загрузки вместо использования

10  
2014-01-11 05:37:19

угловой процесс автоматической загрузки JS

AngularInit () - это первый угловой api, вызываемый для автоматической загрузки с помощью функции jqlite ready.

  1. ready () вызвал DOM ready
  2. angularInit () вызвано из ready ()
  3. Angular Init извлекает элемент ng-app из DOM с помощью элемента.querySelectorAll() одно из следующих формат - 'НГ:приложение', 'НГ-приложение', 'х-НГ-приложение', 'данные-НГ-приложение' Бывший. 
  <body ng-app=ngAppDemo>
      <div ng-controller="ngAppDemoController" >
          I can add: {{a}} + {{b}} =  {{ a+b }}         </div>
  </body>

ng-app="ngAppDemo" will be extracted.
  1. С помощью модуля регулярных выражений извлекается, например. модуль = "ngAppDemo"
  2. наконец bootstrap(..) вызывается, который создает глобальный инжектор и rootscope и загрузочный ремень углового приложения.
6  
2017-05-24 05:55:40

от углового NgModules страницы:

import { NgModule }      from '@angular/core';
import { BrowserModule } from '@angular/platform-browser';
import { AppComponent }  from './app.component';

@NgModule({
  imports:      [ BrowserModule ],
  declarations: [ AppComponent ],
  bootstrap:    [ AppComponent ]
})
export class AppModule { }

наконец, @NgModule.свойство bootstrap определяет этот компонент AppComponent как компонент bootstrap. Когда Angular запускает приложение, он помещает HTML-рендеринг AppComponent в DOM, внутри тегов элементов индекса.формат html.

Bootstrapping в основном.ТС

вы запустите приложение, загрузчик этот модуль в основном.файл ТС.

Angular предлагает множество вариантов начальной загрузки, ориентированных на несколько платформ. На этой странице описаны два варианта, оба из которых предназначены для браузера.

1  
2017-07-12 17:51:01

Comments

    Ничего не найдено.
Click here to cancel reply.