попытаться использовать exportAs в компоненте angular2

Question

Свойство exportAs определено для компонента. Как я могу получить доступ за пределами компонента к его методу? Я попробовал этот пример

<my-app #my="myApp"> 
loading... 
</my-app> 


<button (click)="my.displayMessage()" class="ui button"> 
    Display popup for message element 
</button> 

Здесь класс компонента

import {Component} from 'angular2/core' 

@Component({ 
selector: 'my-app', 
providers: [], 
template: ` 
    <div> 
    <h2>Hello {{name}}</h2> 

    </div> 
    `, 
    directives: [], 
    exportAs: "myApp" 
}) 
export class App { 
    constructor() { 
    this.name = 'Angular2' 
    } 

    displayMessage():void { 
    console.log('called from component') 
    } 
} 

Answer 1

Это не должно работать. У вас не может быть #xxx, (xxx) или любого другого типа Угловое связывание вне шаблона вашего корневого компонента (App).

Вы можете искать что-то вроде How to dynamically create bootstrap modals as Angular2 components?

Answer 2

exportAs используется для директив, см: http://plnkr.co/edit/IlLtBY7Ic9yKiRIpjukf?p=preview

@Directive({ 
    selector: "div", 
    exportAs: "myDiv" 
}) 
class MyDiv { 

    constructor(private element: ElementRef, private renderer: Renderer) { 
    } 

    toUpper() { 
    return this.renderer.setElementStyle(this.element.nativeElement, "text-transform", "uppercase"); 
    } 

    toLower() { 
    return this.renderer.setElementStyle(this.element.nativeElement, "text-transform", "lowercase"); 
    } 

    reset() { 
    return this.renderer.setElementStyle(this.element.nativeElement, "text-transform", ""); 
    } 
}