title: Angular 7 setting selected value not firing change event
body: <p>I have one single selection drop down and multi select drop down. Both is having dynamic value.</p>
  
  <p>What I am doing is the I am clicking on edit button it shows modal inside modal there is select drop-downs of module and multi select of actions.</p>
  
  <p>I am dynamically selecting module name it works perfectly but dependent multi-select is not working. I think single select is not firing change event.</p>
  
  <p>HTML: </p>
  
  <pre><code>&lt;div class="col-md-12"&gt;
      &lt;label for="module"&gt;Select Module&lt;/label&gt;
      &lt;select class="form-control" (change)="onChangeModuleDD($event)" name="moduleSelection" required&gt;
      &lt;option value=""&gt;-- Select Module --&lt;/option&gt;
      &lt;option *ngFor="let module of allModuleData" [value]="module | json" [selected]="module.name == usermodule"&gt;{{
          module.name
          }}&lt;/option&gt;
      &lt;/select&gt;
  &lt;/div&gt;
  
  &lt;div class="col-md-12"&gt;
      &lt;label for="actions"&gt;Select Actions/Charts&lt;/label&gt;
      &lt;ng-multiselect-dropdown [placeholder]="'-- Select Action/Charts --'" [data]="dropdownList" [settings]="dropdownSettings"
          (onSelect)="onItemSelect($event)" name="actionSelection" (onDeSelect)="OnItemDeSelect($event)"
          (onSelectAll)="onSelectAll($event)" (onDeSelectAll)="onDeSelectAll($event)"&gt;
      &lt;/ng-multiselect-dropdown&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p>COMPONENT: </p>
  
  <pre><code>onChangeModuleDD(event) {
      this.selectedItems = [] // empty selected action array
      this.dropdownList = []
      let value = event.target.value
  
      if (value) {
        let parsedValue = JSON.parse(value)
        this.usermodule = parsedValue.name
  
        if (parsedValue.hasCRUD == 0) {
          this.userListingApi.fetchAllDashboardAction().subscribe(res =&gt; {
            this.dropdownList = []
            for (let i = 0; i &lt; res['data'].length; i++) {
              this.dropdownList.push(res['data'][i])
            }
          })
        } else {
          this.userListingApi.fetchAllCRUDAction().subscribe(res =&gt; {
            this.dropdownList = []
            for (let i = 0; i &lt; res['data'].length; i++) {
              this.dropdownList.push(res['data'][i])
            }
          })
        }
      } else {
        console.log('Nothing to display')
      }
    }
  </code></pre>
  
  <p>At the time of insertion it is working perfectly but when I select dynamically it is not working.</p>
  
  <p>EDIT: </p>
  
  <pre><code>onItemSelect(item: any) {
      this.selectedItems.push(item)
  }
  
  OnItemDeSelect(items: any) {
      var id = items._id
      this.selectedItems = this.selectedItems.filter((item) =&gt; item['_id'] !== id);
    }
  
  onDeSelectAll(items: any) {
      this.selectedItems = items
    }
  </code></pre>