déclassement composante de directive de angulaire 2 à AngularJS ne fonctionne pas comme prévu

Question

Voici mon élément angulaire 2:

@Component({ 
    selector: '[my-component]', 
    template:`<ng-content></ng-content>` 
}) 
export class MyComponentClass { 
    @Input() myComponent: string; 

... 

Cela me permet dans l'application angulaire 2 utiliser comme directive sur une balise html, par exemple:

<div [myComponent]="'my text string'"></div> 
<span [myComponent]="'my text string'"></span> 

Mais en prenant la même dégradation des composants à utiliser dans l'application AngularJS:

angular.module('myApp') 
    .directive('myComponent', downgradeComponent({component: MyComponentClass , inputs: ['myComponent']}) as angular.IDirectiveFactory); 

Maintenant, cela ne fonctionnera pas:

<div [myComponent]="'my text string'"></div> // or 
<div [my-component]="'my text string'"></div> 

Seulement si je l'utilise en tant que composant comme

<my-component [my-component]="'some text'"></my-component> 

Qu'est-ce que je fait de mal? Je ne veux pas qu'il soit utilisé comme une nouvelle balise html, mais comme une directive qui peut être ajoutée à n'importe quel élément html (directive).

Answer 1

Essayez d'utiliser downgradeNg2Component au lieu de downgradeComponent:

import {UpgradeAdapter} from 'angular2/upgrade'; 
import {myComponent} from './my-component.component.ts'; 

let upgradeAdapter = new UpgradeAdapter(); 

.directive('myComponent', 
    upgradeAdapter.downgradeNg2Component(myComponent)) 

Cocher cette useful post!

Answer 2

J'ai rencontré le même problème et trouvé un mot autour de: https://github.com/angular/angular/issues/16695#issuecomment-336456199