DevOps, CI/CD and Automation

We have dialog in which we are using the 'oj-select-many' component with 'oj-bind-for-each' for listing the options using a KO observable array. On click of a button, I need to clear the existing entries of the observable array and add new entries to it. I have added the method, where i am calling the KO 'removeAll' method on the observable array and then pushing the new entries in to the array and refreshing the 'oj-select-many' component so that the change gets reflected in the UI. But what i see is, the newly added entries are visible in the options in the UI, but the previous entries are not getting cleared (which i tried achieving by calling KO 'removeAll'). We are using JET 5.0.

The UI code with oj-select-many and 'oj-bind-for-each':

<oj-select-many id="filterSources" on-value-changed="[[sourceFilesChange]]" :title="[[sourcesTitle]]"  value="{{currentModel.sourceOptions.selectedSources}}" max-width="300px">

           <oj-bind-for-each data="[[sourceFileOptions]]"> //'sourceFileOptions' is the observable array i am trying to update

                   <template>

                            <oj-option value="[[$current.data.value]]" :title="[[[[$current.data.label]]]]" class="filterSourceName"><oj-bind-text value="[[$current.data.label]]"></oj-bind-text></oj-option>

                    </template>

              </oj-bind-for-each>

  </oj-select-many>

The js code where i am updating the observable array (sourceFileOptions) referenced in the UI

     updateSourceList: function(newSourceList){

          if (newSourceList && newSourceList.length > 1){

              var filter = require('filter');

              filter.sourceFileOptions.removeAll(); //clearing the current entries in the array

               //add new entries

              for (var i=0 ; i< newSourceList.length; i++ ){

                 var fileName =  newSourceList[i];

                 filter.sourceFileOptions.push({value:fileName, label:fileName});

              }

              $("#filterSources")[0].refresh();

          }

    }

I tried to reset the array entries in the cook book example for select many using ForEach: https://www.oracle.com/webfolder/technetwork/jet/jetCookbook.html?component=selectMany&demo=dataforeach . I am facing the same issue here as well. Calling 'removeAll' on the observable array is not reflected in the UI, while the same logic works when i try with select many using options binding: https://www.oracle.com/webfolder/technetwork/jet/jetCookbook.html?component=selectMany&demo=optionsBinding

Any idea why this does not work with ForEach biinding?

Thanks in Advance!