9

Bileşenimde farklı şablonlar görüntülemek istiyorum. Sadece bir tane gösterecek. hasURLtrue ise, <a></a>'u göstermek istiyorum. hasURLfalse ise, <button></button> değerini göstermek istiyorum.Angular 2'de aynı bileşende birden fazla ng içeriği nasıl kullanılır?

Eğer hasURL yanlışsa problem, bileşen göster düğmesidir, ancak ng-content boştur. Zaten "ilk okunduğunda Çünkü

a></a>

 <a class="bouton" href="{{ href }}" *ngIf="hasURL"> 
      <ng-content> 
      </ng-content> 
     </a> 

     <button class="bouton" *ngIf="!hasURL"> 
      <ng-content> 
      </ng-content>  
     </button> 

teşekkürler!

cevap

11

Sen ng-template içinde ng-content sarın ve kullanabileceği memnun çözmek için bir yolu var mı? ngTemplateOutlet

<a class="bouton" href="{{ href }}" *ngIf="hasURL"> 
    <ng-container *ngTemplateOutlet="contentTpl"></ng-container> 
</a> 

<button class="bouton" *ngIf="!hasURL"> 
    <ng-container *ngTemplateOutlet="contentTpl"></ng-container> 
</button> 
<ng-template #contentTpl><ng-content></ng-content></ng-template> 

Plunker Example

da

+0

Teşekkür bakın! Harika çalışıyor. Ben Angular 2 değil Angular 4 ile hala yaşıyorum, bu yüzden ' 'yerine