0
アップグレードアダプタを使用して角度1のアプリケーションで角度2のコンポーネントを使用しようとしています。 https://angular.io/docs/ts/latest/guide/upgrade.htmlを、私はAppModuleで宣言にコンポーネントを追加するとき、それは私に、このエラーを与える：私はここの指示に従ってきた宣言定義が存在するときに角度2の読み込みがロードされない
(index):47 Error: (SystemJS) Cannot read property 'downgradeNg2Component' of undefined(…)
(anonymous function) @ (index):47ZoneDelegate.invoke @ zone.js:203
Zone.run @ zone.js:96(anonymous function) @ zone.js:462
ZoneDelegate.invokeTask @ zone.js:236Zone.runTask @ zone.js:136
drainMicroTaskQueue @ zone.js:368ZoneTask.invoke @ zone.js:308
nrWrapper @ (index):37
私は同様の問題を持つ人を見つけることができませんでしたし、すべてが大丈夫作品私はAppModuleデコレータの宣言にコンポーネントを追加します。
import { AppModule } from './ng2app.module';
import { adapter } from './adapter';
console.log('MAIN');
adapter.bootstrap(document.querySelector('html'), ['nova']);
adapter.ts：
import { AppModule } from './ng2app.module';
console.log('ADAPTER');
export const adapter = new UpgradeAdapter(AppModule);
ng2app.module
import { Location } from '@angular/common';
import { adapter } from '../adapter';
console.log('COMPONENT');
@Component({
selector: 'hello',
template: `
<h1>Hello World</h1>
`
})
export class HelloComponent {
}
angular.module('nova.directives', [])
.directive('hello', [adapter.downgradeNg2Component(HelloComponent)])
ここmain.tsファイルである：ここで
は私のapp.component.tsファイルがあります.ts：
import { BrowserModule } from '@angular/platform-browser';
import { HelloComponent } from './ng2Components/app.component';
console.log('MODULE');
@NgModule({
imports: [ BrowserModule ],
declarations: [ HelloComponent ]
})
export class AppModule {}
何らかの理由でapp.component.tsが他のものの前に読み込まれているようです。ここで
は（クイックスタートから）私のsystemjs.configファイルです：
/**
* System configuration for Angular samples
* Adjust as necessary for your application needs.
*/
(function (global) {
System.config({
baseUrl: 'app',
paths: {
// paths serve as alias
'npm:': 'node_modules/'
},
// map tells the System loader where to look for things
map: {
// our app is within the app folder
app: 'app',
// angular bundles
'@angular/core': 'npm:@angular/core/bundles/core.umd.js',
'@angular/common': 'npm:@angular/common/bundles/common.umd.js',
'@angular/compiler': 'npm:@angular/compiler/bundles/compiler.umd.js',
'@angular/platform-browser': 'npm:@angular/platform-browser/bundles/platform-browser.umd.js',
'@angular/platform-browser-dynamic': 'npm:@angular/platform-browser-dynamic/bundles/platform-browser-dynamic.umd.js',
'@angular/http': 'npm:@angular/http/bundles/http.umd.js',
'@angular/router': 'npm:@angular/router/bundles/router.umd.js',
'@angular/forms': 'npm:@angular/forms/bundles/forms.umd.js',
'@angular/upgrade': 'npm:@angular/upgrade/bundles/upgrade.umd.js',
// other libraries
'rxjs': 'npm:rxjs',
'angular-in-memory-web-api': 'npm:angular-in-memory-web-api',
},
// packages tells the System loader how to load when no filename and/or no extension
packages: {
app: {
main: './main.js',
defaultExtension: 'js'
},
rxjs: {
defaultExtension: 'js'
},
'angular-in-memory-web-api': {
main: './index.js',
defaultExtension: 'js'
}
}
});
})(this);
アプリはtypescriptですファイルをtranspileするがぶ飲みを使用しています。
何が起こっているのかをトラッキングするのに役立ちます。