2016-04-11 29 views
6

Ho una domanda sull'associazione in angular2.Bind angolare2 utilizzando l'operatore condizionale

ho scritto un semplice componente, questo è il codice:

@Component({ 
    selector: 'drawer-item', 
    templateUrl: '../res/views/drawer-item.html' 
}) 
export class DrawerItemComponent 
{ 
    @Input() text:string; 
    @Input() icon:string; 
    @Input() textClass:string; 
} 

<div class="drawer-item-text word-wrap {{textClass}}"> {{text}}</div> 
<i class="mdi mdi-{{icon}} drawer-item-img"></i> 

Io lo uso come questo:

<drawer-item (click)="selectCompany()" [text]="selectedCompanyLabel" [icon]="selectedCompanyIcon" [textClass]="selectedCompanyClass"></drawer-item> 

Come potete vedere sto vincolante il testo con la variabile, per esempio con selectedCompanyLabel. In questo modo tutto funziona alla grande e se selezionaCompanyLabel cambia anche l'etichetta.

vorrei evitare che variabili utilizzando qualcosa di simile:

[text]="company ? 'company.name' : 'Select a company'" 

Ma è in questo modo il contenuto non è rilegato. Pertanto, se la società azienda cambia, l'etichetta non viene aggiornata.

Ma se uso questa strategia in uno stile, funziona! Ad esempio qualcosa di simile funziona alla grande:

<div class="company ? 'italic' : 'bold'"> ... </div> 

Sai perché?

Grazie mille

risposta

11

Vorrei utilizzare il seguente invece:

[text]="company ? company.name : 'Select a company'" 

senza virgolette per company.name.

2

Non è sicuro dalla tua domanda qual è il problema, ma credo che questo è quello che stai cercando per

[text]="company?.name"