Set HTML space code in Typescript angular 2

Question

I just a problem about how to set space to my value in html. I have code :

    setValuetoComboBox(test:string, lvl:number){
    let lastTest:string;
    let spaceString:string;
    //&#160;
    spaceString='&#160';
    for(var i = 1; i <= lvl; i++){
        spaceString=spaceString + '&#160';
    }
    lastTest = spaceString + test;
    return lastTest;
}

In this code, i have &#160 which to make space in html. and i have code in html:

                                    <select [formControl]="parent" class="form-control">
                                    <option value="-1">Root</option>
                                    <option value="{{test.id}}" *ngFor="let test of parentValue">
                                        {{setValuetoComboBox(test.name, test.lvl)}}
                                    </option>
                                </select>

and the result is :

The Result

this the wrong result, i want space not code &#160. Can anyone find the answer about my problem ?

Use ' ' instead of the code?

eko
– eko

2016-12-21 06:54:28 +00:00
Commented Dec 21, 2016 at 6:54 — eko
– eko, Commented Dec 21, 2016 at 6:54

Community · Accepted Answer · 2017-05-23 11:54:15Z

2

I guess what you actually want is

<option value="{{test.id}}" *ngFor="let test of parentValue"
    [innerHTML]="setValuetoComboBox(test.name, test.lvl)">
</option>

With {{ }} the literal string will be inserted.

You might need to mark it as secure using the sanitizer for example like shown in How to bind raw html in Angular2

You should be aware that setValuetoComboBox(...) might be called very often (every time Angular runs change detection). It's usually a good idea to assign the results of the call in a property and bind to this property instead of binding to a function.

Binding to functions in the view is generally discouraged because of this. It can cause serious performance issues.

edited May 23, 2017 at 11:54

CommunityBot

11 silver badge

answered Dec 21, 2016 at 6:57

Günter Zöchbauer

661k235 gold badges2.1k silver badges1.6k bronze badges

Sign up to request clarification or add additional context in comments.

Collectives™ on Stack Overflow

Set HTML space code in Typescript angular 2

1 Answer 1

Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related