* ngfor Angular 2中的字符串连接

Question

I would like to join strings in multiline within *ngfor angular 2 directive.

var contacts = [str1, str2, str3];

<div *ngFor="let c of contacts;let last = last; let str = str + c;">
    <div *ngIf="last">
         {{str}}
    </div>
</div>

I know the above code is not valid. But I want to know something like above is possible to achieve?

Expected Output should be

Str1

Str2

Str3

Note: I want to achieve something like below code in C# using a angular ngfor.

   var str = "";

   foreach(var item in items)
   {
     str = str + item.toString();
   }
   console.log(str);

Answer 1

update

*ngFor can be used to calculate values depending on previous items. The best way would be to prepare the list in code and then just bind *ngFor to that resulting list.

original

You can't use arbitrary expressions with let . Only context variables provided by *ngFor can be assigned.

This way it should produce the results you want

<div *ngFor="let c of contacts;let last = last">
    <div *ngIf="last">
         {{str}}{{c}}
    </div>
</div>

Answer 2

Perhaps something as simple as join would suffice:

untested

var contacts = ['str1', 'str2', 'str3'];

<div [innerHtml]="contacts.join('')"></div>

Answer 3

You can simply output the two strings one after another:

let contacts = [str1, str2, str3];

<div *ngFor="let c of contacts;let last = last;">
    <div *ngIf="last">
         {{str}}{{c}}
    </div>
</div>