Angular2, innerHTML

Question

içinde bağlama bileşenine nasıl bağlanır? Şablonda denetleyicideki bir özellikten HTML'yi gömecek olan myApp bileşenini oluşturmak istiyorum. Bununla birlikte, bu HTML’nin bir kısmı başka bileşen seçicileri içerebilir.

Bu örnekte

import {InfoComponent} from ... 
@Component({ 
    selector: 'myApp', 
    template: `<div [innerHTML]='hData'></div> 
       <myInfo></myInfo>`, 
    directives: [InfoComponent] 
}) 
export class AppComponent { 
    hData = "<myInfo></myInfo>"; 
} 

@Component({ 
    selector: 'myInfo', 
    template: "<b>This is a test</b>" 
}) 
export class InfoComponent { 
} 

, ben This is a test iki kez görüntülenir görmeyi bekleriz. Bununla birlikte, Angular2 motorunun, Bileşen seçicinin enjekte edildiği gerçeğini seçtiği görülmez, bu yüzden şablon, bağlama yoluyla eklenmiş olan <myInfo></myInfo> seçicisi için asla üretilmez.

Bir demo here görebilirsiniz.

Angular2'yi, seçiciyi şablonda açıkça eklenen seçiciyle aynı şekilde ayrıştırmak için almanın bir yolu var mı?

Answer 1

[innerHtml]="..." örneğini Açısal bileşenler veya yönergeler yapmanın veya herhangi bir bağlama oluşturma yöntemi yoktur.

Bu gereksinim için en yakın olan DynamicComponentLoader. RC.5 Angular2 stilleri sterilize ve HTML bağlanması ile ilave yana ViewContainerRef.createComponent()

Örnek

için Angular 2 dynamic tabs with user-click chosen components (Bkz DynamicComponentLoader bir süre önce çıkarıldı). Daha fazla ayrıntı için In RC.1 some styles can't be added using binding syntax'a bakın.