How to write *ngIf for input placeholder in Angular2?

user_8173932 0
Viewed 17457

I have a template 

<ng-container *ngFor="let text of texts[i]; let j = index">{{text}}
  <input type="text">
      </ng-container>

I also have an array myWords

myWords = ['orange', 'blue', 'green'];

How could I insert these words like a placeholder, but only in special case, like 

this.app-part

I have 3 parts in my app, but I would like to have a placeholder (words from myWords) only in 3rd part, and if I have 1st or 2nd part - I don't need any placeholder there.

angular-ng-if angular
3 Answers

I'm using a similar case with a boolean.

<!-- if extraKilometers is true then I'll type 'Who?' else I'll type 'What?' -->
<textarea class="form-control input-wide-400" 
                              placeholder="{{extraKilometers ? 'Who?' : 'What?'}}" 
                              aria-label="distance" 
                              formControlName="description"
                              rows=2
                              id="transportDescription"></textarea>

In your specific example I'd use:

<ng-container *ngFor="let text of texts; let j = index">{{text}}
  <input type="text" placeholder="{{ myWords[j] }}" >
</ng-container>

Here's a stackblitz demo with the info you've given using this method

user_47430960

for anybody looking for something similar(like I was) - you can also call method from placeholder like that:

[placeholder]="someMethod() ? 'placeholder1' : 'placeholder2'"

user_82720820
Related