除非使用 setTimeout，否则 Bootstrap 多选 selectAll 不适用于

Question

显然，Bootstrap 多选在将 jQuerymultiselect()与 Knockout.js 一起使用时有一个限制，因此如果在 Knockout 事件（在以下示例中为单击事件）期间通过代码修改了多选下拉列表，则不会应用该代码。

下面的例子演示了它：

1. 首先，单击左侧的按钮。您会看到，虽然创建了选项，但并未选中它们。您需要再次单击才能选中它们。

2. 然后，单击右侧的按钮。您将看到选项被创建和选择。我使用了 1000 毫秒的超时，但它也仅适用于 1 毫秒的超时。

我的问题：有没有比超时更好的selectAll()工作方式？

var selectorVM = function () {

        var self = this;

  self.available = ko.observableArray([]);

  self.selected = ko.observableArray([]);

  self.init = function () {

    self.initOptions();

    self.selectAll();

  };

  self.initWithTimeout = function () {

    self.initOptions();

    self.selectAllWithTimeout();

  };

  self.initOptions = function () {

    self.available([]);

    self.available([

      { name: "option 1", value: 1}, 

      { name: "option 2", value: 2}

    ]);  

  };

  self.selectAll = function () {

      var $selector = $("#selector");

      $selector.multiselect('selectAll', false);

      $selector.multiselect('updateButtonText');

  };

  self.selectAllWithTimeout = function () {

    setTimeout(self.selectAll, 1000);

  };

}

var selectorVM = new selectorVM();

ko.applyBindings(selectorVM);

<script src="https://cdnjs.cloudflare.com/ajax/libs/knockout/3.4.2/knockout-min.js"></script>

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>

<script src="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/3.3.7/js/bootstrap.min.js"></script>

<script src="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-multiselect/0.9.15/js/bootstrap-multiselect.min.js"></script>

<link href="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/3.3.7/css/bootstrap.min.css" rel="stylesheet"/>

<link href="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-multiselect/0.9.15/css/bootstrap-multiselect.css" rel="stylesheet"/>