我有使用Angular 1.5编写的遗留应用程序,我想添加用Angular 2编写的新组件
但我对ng2-translate
有疑问所以这是我的组件 home.ts
import {Component} from '@angular/core';
import {TranslateService, TranslateLoader, TranslateStaticLoader, TranslatePipe} from 'ng2-translate/ng2-translate';
import {Http} from '@angular/http';
@Component({
selector: 'home',
providers: [ TranslateService ],
templateUrl: './home.html'
})
export class Home {
constructor(translate: TranslateService) {
// this language will be used as a fallback when a translation isn't found in the current language
translate.setDefaultLang('en');
// the lang to use, if the lang isn't available, it will use the current loader to get them
translate.use('en');
}
}
这是home.html
<h3>Home Component</h3>
<p>Welcome to Angular Seed</p>
{{ 'app.system' | translate }}
这是main.ts
import { NgModule, forwardRef } from '@angular/core'
import { UpgradeAdapter } from '@angular/upgrade';
import { Home } from './home/home';
import {TranslateModule, TranslateService} from 'ng2-translate/ng2-translate';
import { BrowserModule } from "@angular/platform-browser";
import {HttpModule} from "@angular/http";
declare let angular: any;
const upgradeAdapter = new UpgradeAdapter(forwardRef(() => MyNg2Module));
const app = angular.module('app');
app.directive('home', upgradeAdapter.downgradeNg2Component(Home));
@NgModule({
declarations: [Home],
imports: [
BrowserModule,
TranslateModule.forRoot()
],
providers: [ TranslateService ],
bootstrap : [Home]
})
class MyNg2Module {}
upgradeAdapter.bootstrap(document.documentElement, ['app']);
所以我使用的是最新版本的Angular 2 rc5。 并收到以下错误
ViewWrappedException {_wrapperMessage: "Error in ./Home class Home_Host - inline template:0:0", _originalException: NoProviderError, _originalStack: "Error: DI Exception↵ at NoProviderError.BaseExc…tor.getInternal (constructor.ngfactory.js:174:56)", _context: DebugContext, _wrapperStack: "Error: Error in ./Home class Home_Host - inline te…s://portal.com/js/vendor.js:338:136)"}_context: DebugContext_originalException: NoProviderError_originalStack: "Error: DI Exception↵ at NoProviderError.BaseException [as constructor] (https://portal.com/js/boot.bundle.min.js:53728:21)↵ at NoProviderError.AbstractProviderError [as constructor] (https://portal.com/js/boot.bundle.min.js:50738:14)↵ at new NoProviderError (https://portal.com/js/boot.bundle.min.js:50762:14)↵ at ReflectiveInjector_.$__System.registerDynamic.ReflectiveInjector_._throwOrNull (https://portal.com/js/boot.bundle.min.js:50181:15)↵ at ReflectiveInjector_.$__System.registerDynamic.ReflectiveInjector_._getByKeyDefault (https://portal.com/js/boot.bundle.min.js:50205:21)↵ at ReflectiveInjector_.$__System.registerDynamic.ReflectiveInjector_._getByKey (https://portal.com/js/boot.bundle.min.js:50174:21)↵ at ReflectiveInjector_.$__System.registerDynamic.ReflectiveInjector_.get (https://portal.com/js/boot.bundle.min.js:49987:19)↵ at NgModuleInjector.get (constructor.ngfactory.js:110:104)↵ at NgModuleInjector.get (constructor.ngfactory.js:115:108)↵ at NgModuleInjector.constructorInjector.getInternal (constructor.ngfactory.js:174:56)"_wrapperMessage: "Error in ./Home class Home_Host - inline template:0:0"_wrapperStack: "Error: Error in ./Home class Home_Host - inline template:0:0↵ at ViewWrappedException.WrappedException [as constructor] (https://portal.com/js/boot.bundle.min.js:53744:29)↵ at new ViewWrappedException (https://portal.com/js/boot.bundle.min.js:51646:14)↵ at DebugAppView.$__System.registerDynamic.DebugAppView._rethrowWithContext (https://portal.com/js/boot.bundle.min.js:48650:17)↵ at DebugAppView.$__System.registerDynamic.DebugAppView.create (https://portal.com/js/boot.bundle.min.js:48598:14)↵ at ComponentFactory.$__System.registerDynamic.ComponentFactory.create (https://portal.com/js/boot.bundle.min.js:44422:34)↵ at DowngradeNg2ComponentAdapter.$__System.registerDynamic.DowngradeNg2ComponentAdapter.bootstrapNg2 (https://portal.com/js/boot.bundle.min.js:8763:49)↵ at post (https://portal.com/js/boot.bundle.min.js:27857:20)↵ at ka (https://portal.com/js/vendor.js:359:16)↵ at u (https://portal.com/js/vendor.js:346:326)↵ at g (https://portal.com/js/vendor.js:338:136)"context: (...)message: (...)originalException: (...)originalStack: (...)wrapperMessage: (...)wrapperStack: (...)__proto__: WrappedException "<home id="NG2_UPGRADE_0_home_c0">"
任何人都可以帮助我吗?我尝试了所有变种:(
我也下载了angular2-seed并在那里添加了相同的代码,它的工作原理! 但不适用于混合应用。