Knockout.js - 在通过observable设置值时阻止更改事件绑定

I have a DropDownList with the following bindings:

我有一个带有以下绑定的DropDownList：

<select data-bind="value: DropDownValue, event: { change: OnChange }">
    <option value="1">Val 1</option>
    /* and more */
</select>

The OnChange event is fired correctly when the user select a different value from the DropDownList.

当用户从DropDownList中选择不同的值时，将正确触发OnChange事件。

The event is also fired when updating the value of the observable property using viewModel.DropDownValue(1).

使用viewModel.DropDownValue（1）更新observable属性的值时也会触发该事件。

What I'm trying to achieve, is to trigger the change event ONLY when the user sets the value through the UI.

我想要实现的是，仅当用户通过UI设置值时才触发更改事件。

Is it possible to block the change event when updating the value through the observable?

通过observable更新值时是否可以阻止更改事件？

This is the JSFiddle example: https://jsfiddle.net/5ex5j7jL/3/

这是JSFiddle示例：https：//jsfiddle.net/5ex5j7jL/3/

1 个解决方案

#1

Looks like one way to do it is to use the isTrusted property of the event object (true when the event was generated by a user action, false when generated by a script):

看起来一种方法是使用事件对象的isTrusted属性（当事件由用户操作生成时为true，由脚本生成时为false）：

self.OnChange = function(viewModel, event) {
  if(event.isTrusted) {
    console.log("from dropdown");
    return;
  } else {
    console.log("NOT from dropdown");
    // do something
  }
};

See updated fiddle

看到更新的小提琴

EDIT

编辑

Of course, you have to implement some king of mechanism if you want to prevent the user from changing the dropdown via the UI:

当然，如果要阻止用户通过UI更改下拉列表，您必须实现一些机制之王：

function ViewModel() {

    var self = this;

    self.DropDownValue = ko.observable();
    self._original = null;

    self.OnChange = function(viewModel, event) {
      if(event.isTrusted) {
        // rollback the viewModel value to the old one
        viewModel.DropDownValue(self._original)
        return false
      } else {
        // keep a reference to the latest value for later rollback
        self._original = ko.unwrap(viewModel.DropDownValue)
      }
    };
};

See this updated fiddle

看到这个更新的小提琴

#1