PrimeNG dropdown selected item data binding
<p>I am simply trying to bind data from a dropdown menu with <code>ngModel</code>.  There is an error I receive when the app loads that makes some sense.</p>

<pre><code>browser_adapter.js:84 EXCEPTION: No value accessor for ''
</code></pre>

<p>This leads me to believe that the error is stemming from the fact that <code>ngModel</code> is not initially bound with any data when the app loads.  </p>

<p>I'm not the best at using Observables... so beware.</p>

<p><strong>Partial of the html dropdown</strong></p>

<pre><code>&lt;p-dropdown [options]="actionsToTake" (onChange)="onToggleCreateActionInput()" 
  [(ngModel)]="action"&gt;&lt;/p-dropdown&gt;
</code></pre>

<p><strong>Relevant TypeScript (excluded imports)</strong></p>

<pre><code>export class ActionView {
  public actionsToTake: SelectItem[] = [];
  public action: Action = new Action();

  constructor (private actionCreateService: ActionCreateService) {
    // populate dropdown list (actionsToTake) with data from service call
    this.actionCreateService.getActionFields().subscribe((resp) =&gt; {
      for (let i = 0; i &lt; resp.data.data.actionElm.length; i++) {
        this.actionsToTake.push({label: resp.data.data.actionElm[i].name,
          value: resp.data.data.actionElm[i].name});
      }
    });
  }

  public onToggleCreateActionInput = (action): void =&gt; {
    // test if something in "action" exists, and then do something based on that
  };
}
</code></pre>

<p>So, when the app initially loads, <code>action</code> is empty.  I would expect that an empty value bound to <code>ngModel</code> wouldn't break the app, but maybe I am misinterpreting the error.  Ultimately I want the selected item to be bound, and I think getting past this error will get me to that point. </p>