Save popover form content in ng-bootstrap (Angular 2+)

Question

Is it possible to have an input in a popover and keep the field values?

If I click the popover button and type into the input field, the input field gets cleared when they close the popover

If not possible with ng-bootstrap...could it work with ngx-bootstrap?

Demo is here

<ng-template #popContent>
  Hello, <b>{{name}}</b>!
  <input type="text">
</ng-template>
<ng-template #popTitle>
    Fancy <b>content!!</b>
</ng-template>
<div style="text-align:center">
  <button type="button" class="btn btn-outline-secondary" [ngbPopover]="popContent" [autoClose]="'outside'" [popoverTitle]="popTitle">
    I've got an input field!
  </button>
</div>

Answer 1

Yes it is possible, we need to define a local property which we use as the ngModel of the input field. This way they will be tied together and you can pass that value around any way you want.

https://stackblitz.com/edit/angular-fyhdcf-ukrs4a