Add new items to list of in dropdown

I have 6 ng-selects that are being dynamically built based on a list. I’m trying to give the user the option of adding a value to a drop-down if the value they want doesn’t exist. I have created an interfacte that adds the item to the values list of that dropdown behind the scenes. After the add, the new option isn’t display in the drop-down, but it does exist within the object that built the list.

Is there a fresh I can call or something?

Here is the ng-select and the add function.

<div class="padding-bottom col-xs-12 col-md-4" *ngFor="let option of segmentOptions"><div *ngIf="option.txt_Header_Name !== 'UPC'">
              <label>{{option.txt_Header_Name}}</label>
              <ng-select id="header-{{option.id_Header_ID}}" [items]="option.values" bindLabel="txt_Header_Value" [loading]="optionsLoading"></ng-select>
            </div>
          </div>

addHeaderValue(header, headerValue) {
    for (let i = 0; i < this.segmentOptions.length; i++) {
      if(this.segmentOptions[i].txt_Header_Name === header.txt_Header_Name){
        this.segmentOptions[i].values.push({id_Header_Value_ID: "00000", id_Header_ID: 3, txt_Header_Value: headerValue});
        break;
      }
    }
  }

[abney317]

If anyone runs across this and is confused as to why the change detection example is putting an array back into another array which causes your items to not be there, this is what I did instead:

this.items.push({id: 1, name: 'New item'}); this.items = this.items.slice(0);

[varnastadeus]

https://github.com/ng-select/ng-select#change-detection