2016-12-16 17 views
0

Я пытаюсь использовать Angular в существующем проекте машинописного текста, где я использую браузер, чтобы связать фактическое приложение.Использование Angular 2 без Reflect.js и zone.js в браузере

Теперь я в основном просто перестроен приложение из setup tutorial и удалось получить все это работать:

угловую/приложение/app.component.ts

import { Component } from '@angular/core'; 

@Component({ 
    selector: 'my-app', 
    template: `<h1>Hello {{name}}</h1>` 
}) 
export class AppComponent { name = 'Angular'; } 

угловую/приложение /app.module.ts

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

угловое/а стр/main.ts

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

export function render() {  
    platformBrowserDynamic().bootstrapModule(AppModule);  
} 

И, наконец, мой Bundle-фасад, который компилируется в standanlone расслоении через browserify:

мои-app.ts

import { render } from "./angular/app/main"; 

export = { 
    testAngular: render // This is the function that I call in my HTML page 
} 

только что меня много беспокоит, что я должен добавить

<script src="path/to/zone.js"></script> 
<script src="path/to/Reflect.js"></script> 

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

Uncaught прокладка отражает-метаданные при использовании декораторов класса

ли есть способ избавиться от этого или сделать оба этих модуля частью моего пакета каким-то импортным заявлением?

Или есть ли какая-либо другая лучшая практика для решения проблемы, которую регулируют прокладки?

ответ

2

мне удалось решить эту проблему путем добавления

import 'zone.js'; 
import 'reflect-metadata'; 

сверху (!!) из my-app.ts (по расслоению корневого файла).

0

Относится к принятому ответу, но не имеет репутации на комментарий

вы не должны импортировать zone.js из вашего приложения, как это. Если вы делаете , вы загружаете пролифа слишком поздно, что означает, что часть ваша среда (загрузчик модуля) не будет находиться под надзором zone.js - возможно, что-то будет работать некоторое время, но рано или поздно вы столкнетесь с проблемами при обновлении обновлений ui, и вы не узнаете почему.

По этой причине лучше всегда включать все полиполки перед любым загрузочным модулем (systemjs) или кодом приложения. Вот почему мы рекомендуем загрузочные зоны в качестве первого скрипта в index.html.

От GitHub: issue и comment

Короче добавить zone.js и reflect.js в index.html. Вам нужно было написать файлы сценариев один раз только на индексной странице (каждая другая страница загружается внутри индексной страницы, и поэтому для них уже загружена зона, а для них уже загружена функция reflect.js.