title: PrimeNG dropdown selected item data binding
body: <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>