Привязка клика по нокауту не срабатывает при клике

Question

Просто установите базовую модель представления knokcout и соответствующее представление html, но функция щелчка не срабатывает.

<script>
    new myModel.XYZ();
</script>

<div id="bar-1">
    <button
            title="Get Document"
            data-toggle="tooltip"
            data-bind="click: getDocument">
        <span class="fas fa-file-alt"></span>
    </button>
</div> 

и моя модель просмотра настроена как;

myModel.XYZ = function (par) {
    var self = this;

    self.getDocument = function(submission) {
       alert('');
       }
    ko.applyBindings(self, $("#bar-1")[0]);
};

Нет ошибки консоли или чего-либо еще, что могло бы помочь мне выяснить проблему.

Answer 1

Я в основном согласен с @erpfast, но если вы все еще хотите реализовать свой путь, вы забыли объявить myModel и добавили метод для Object.

var myModel ={};
myModel.XYZ = function (par) {
    var self = this;

    self.getDocument = function(submission) {
       alert('');
       }
    ko.applyBindings(self, $("#bar-1")[0]);
};

new myModel.XYZ();

<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>
<div id="bar-1">
    <button
            title="Get Document"
            data-toggle="tooltip"
            data-bind="click: getDocument">
            Button
        <span class="fas fa-file-alt"></span>
    </button>
</div>

Answer 2

Сначала определите вашу модель

var myModel = function(par) {
   var self = this;
   self.getDocument = function(submission) {
      alert('');
   }
}

Затем установите привязку

ko.applyBindings(new myModel(document.getElementById("#bar-1")));

JSFiddle