Дюрандальте MessageBox кнопка закрытия на верхних

Question

по умолчанию durandal MessageBox поля, как это: и названа: messageBox.html

<div class="messageBox"> 
    <div class="modal-header"> 
     <h3 data-bind="html: title"></h3>z 
    </div> 
    <div class="modal-body"> 
     <p class="message" data-bind="html: message"></p> 
    </div> 
    <div class="modal-footer" data-bind="foreach: options"> 
     <button class="btn" data-bind="click: function() { $parent.selectOption($data); }, html: $data, css: { 'btn-primary': $index() == 0, autofocus: $index() == 0 }"></button> 
    </div> 
</div> 

теперь вот, я хотел бы поставить кнопку X на правой стороне заголовка:

поэтому я положил X в модальный заголовок, но я не могу понять, где и что должен писать код, поэтому, когда пользователь нажимает на X, всплывающее окно закрывается.

messageBox.js как это:

define(function() { 
    var MessageBox = function(message, title, options) { 
     this.message = message; 
     this.title = title || MessageBox.defaultTitle; 
     this.options = options || MessageBox.defaultOptions; 
    }; 

    MessageBox.prototype.selectOption = function (dialogResult) { 
     this.modal.close(dialogResult); 
    }; 

    MessageBox.defaultTitle = ''; 
    MessageBox.defaultOptions = ['Ok']; 

    return MessageBox; 
}); 

Answer 1

Вам нужно сделать Нокаут связывание с функцией закрытия модального

<div class="modal-header"> 
    <h3 data-bind="html: title"></h3> 
    <span data-bind="click: function() { $parent.close(); }>X</span> 
</div> 

В то время как Ваш файл JS выглядит следующим образом:

define(function() { 
    var MessageBox = function(message, title, options) { 
     this.message = message; 
     this.title = title || MessageBox.defaultTitle; 
     this.options = options || MessageBox.defaultOptions; 
    }; 

    MessageBox.prototype.selectOption = function (dialogResult) { 
     this.modal.close(dialogResult); 
    }; 

    MessageBox.prototype.close = function() { 
     this.modal.close(); 
    }; 

    MessageBox.defaultTitle = ''; 
    MessageBox.defaultOptions = ['Ok']; 

    return MessageBox; 
});