Angular2 bootstrap извне файл машинописного текста, непосредственно с html страницы

Question

У меня есть существующий сайт, который построен с angular1+requirejs и php. Я хотел бы добавить angular2 (который я уже добавил, используя angular2-cli).

мне не нужно angular1 общаться с angular2, поэтому мы не должны делать ng-upgrade

Я хочу самонастройки angular2 компоненты вне app componenttypescript файла.

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

Я пытаюсь загрузить различные компоненты на страницу, когда-то один, а иногда и больше.

Answer 1

На самом деле, прежде всего, вам нужно предоставить дополнительную информацию. Но, по большому счету, вы создали корневой модуль и объявляете компонент, который принадлежит ему, то же самое для директив и т. Д. Ex.

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 {} 

bootstraping модуль:

import { platformBrowserDynamic } from '@angular/platform-browser-dynamic'; 
import { AppModule } from './app.module'; 
platformBrowserDynamic().bootstrapModule(AppModule); 

в любом случае, вы можете проверить это, чтобы получить некоторое представление о том ngModule

Это как boostrap с JavaScript. Создание модуля:

(function(app) { 
    app.AppModule = 
    ng.core.NgModule({ 
     imports: [ ng.platformBrowser.BrowserModule ], 
     declarations: [ app.AppComponent ], 
     bootstrap: [ app.AppComponent ] 
    }) 
    .Class({ 
     constructor: function() {} 
    }); 
})(window.app || (window.app = {})); 

bootstraping:

(function(app) { 
    document.addEventListener('DOMContentLoaded', function() { 
    ng.platformBrowserDynamic 
     .platformBrowserDynamic() 
     .bootstrapModule(app.AppModule); 
    }); 
})(window.app || (window.app = {}));