Avoid & in ng-select drop down in angular 7

Question

I am using the ng-select drop-down list. If I use ng-option then if it gets "&" it adds "amp;" with "&". But if I only use ng-select it works perfectly. I can not use any directives to replace value because in the background the value does not change. But at the time of showing it adds "amp;".

 <ng-select [clearable]="false" (change)="onChangeBusinessUnit()" [disabled]="model.canChangeBusinessUnit != 1"
              [(ngModel)]="model.selectBusinessUnit" name="selectBusinessUnit">
              <ng-option value="">{{ langService.langData.select }}</ng-option>
              <ng-option *ngFor="let businessUnit of model.businessUnitList" [value]="businessUnit.BU_NO">{{
                businessUnit.BU_NAME }}</ng-option>
            </ng-select>

In the drow-down show likes

See in the stackblitz: https://stackblitz.com/edit/ng-select-i19fsr?file=app/app.component.ts

Possible duplicate of [Unescape HTML entities in Javascript?](https://stackoverflow.com/questions/1912501/unescape-html-entities-in-javascript) — Anurag Srivastava, Mar 02 '19 at 07:54
@AnuragSrivastava it cannot resolve my issue. It is perfectly working in the bootstrap dropdown. But in the ng-select drop-down,n it adds "amp" when it gets "&". — Sabbir, Mar 02 '19 at 07:59
You need to add a pipe to your `[value]` in `ng-option`, and return the html decoded value in the pipe. — Anurag Srivastava, Mar 02 '19 at 08:01
@AnuragSrivastava can you help me a bit more with some code. — Sabbir, Mar 02 '19 at 08:04
If you can create a minimal example on https://stackblitz.com/edit/angular-playground, I can try to guide you. — Anurag Srivastava, Mar 02 '19 at 08:11
@AnuragSrivastava I have tired it in StackBlitz it works perfectly. But I cannot understand why it adds "amp" in my dropdown. — Sabbir, Mar 02 '19 at 08:41
What do you get as the `console.log` of `model.businessUnitList` does it have & or &? — Anurag Srivastava, Mar 02 '19 at 09:12

score 0 · Answer 1 · edited Aug 26 '19 at 16:05

0

You can try manually updating &amp ; with replace

{{ value.replace(/&amp ;/g, '&') }}

For what it's worth, HTML should automatically translate & to &. It seems like you have a rogue spacebar inside of &amp ; which is preventing that from happening or create Pipe like this {{value | [pipe]}}

edited Aug 26 '19 at 16:05

abney317

7,760
6
32
56

answered Mar 02 '19 at 09:28

mosi98

575
6
16

nice try but unfortunately does not work. I have also made a pipe. But when I send or get the value it goes absolutely fine. In the time of showing dropdown, it adds "amp;", – Sabbir Mar 05 '19 at 07:01

Avoid & in ng-select drop down in angular 7

1 Answers1