angularjs（1.5）应用程序中的ng2组件

Question

我正在尝试在angularjs（v1.5）应用程序中使用angular2组件。 使用纯js（ES6）我成功地在我的应用程序中使用downgradeNg2Component类UpgradeAdapter类函数运行ng2组件。

我使用以下代码启动我的应用程序：

var upgradeAdapter = new ng.upgrade.UpgradeAdapter();
    upgradeAdapter.bootstrap(document.getElementById("my-container"), ["MyModule"]);

它工作正常。

问题是当我尝试使用TypeScript时。 我创建了一个看起来像这样的组件：（ pmComponent.ts ）

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

@Component({
    selector: 'appi',
    template: `
    <div class="app">
      HELLO 
    </div>
  `
})
export class AppComponent {
}

我的HTML看起来像：

<script>
        System.import('pmComponent.js').then(module => {
            angular.module('MyModule').directive(
                    'appi',
                    window.upgradeAdapter.downgradeNg2Component(module.AppComponent));
        }).catch(function (err) { console.error(err); });
</script>
<appi></appi>

我收到错误消息： 例外：在AppComponent上找不到指令注释

有人可以帮我解决这个问题吗？ 谢谢！