Hace poco me he separado ViewModel a un archivo JavaScript independiente.

var Report = (function($) {
    var initialData = [];
    var viewModel = {
        reports: ko.observableArray(initialData),
        preview: function(path) {
            //preview report
        },
        otherFunctions: function() {}
    };
    return viewModel;
})(jQuery);​

Aquí está el código HTML y knock-out relacionados con el código de

<script type="text/javascript" src="path/to/report/javascript"></script>
<script type="text/javascript">
    $(document).ready(function () {
        ko.applyBindings(Report, document.body);
    });
</script>

HTML, interfaz de usuario dispone de un botón en el que haga clic en datos se unen a la función de vista previa en el modelo de vista

<input type="button" name="Preview" id="Preview" class="btnPreview" 
    data-bind="click: Report.preview('url/to/report')" />

Problema vista previa método es llamado cuando la siguiente línea de ejecutar en $(document).listo() función

ko.applyBindings(Report, document.body); 

Que es sin que el usuario haga clic en el botón de Previsualización de la función de vista previa es despedido. ¿Cuál podría ser la razón para este comportamiento? Toda la materia estaba funcionando bien, cuando me gustaría ver el modelo de JavaScript en el código HTML de la página en sí.

InformationsquelleAutor Raj | 2012-04-12

2 Comentarios

  1. 85

    La razón es, que usted está, de hecho, la invocación de la función de vista previa (ya que la escritura de functionName hace referencia a la función, la escritura functionName() significa llamar).

    Así data-bind="click: Report.preview" estaría trabajando como se esperaba, pero sin entregar el parámetro.

    Como el manual estados (sobre un tema diferente, pero esto todavía se aplica):

    Si necesitas pasar más parámetros, una forma de hacerlo es mediante la envoltura de su controlador en un literal de función que toma un parámetro, como en este ejemplo:

    <button data-bind="click: function(data, event) { myFunction(data, event, 'param1', 'param2') }">
        Click me
    </button>

    o, en su caso:

    data-bind="click: function() { Report.preview('url/to/report') }"

    Otra solución sería hacer una vista previa() devuelve una función (más o menos lo mismo en realidad):

    preview: function(path) {
        return function() {
            //...
        }
    }
    • Me tomé un minuto para obtener esta respuesta. La aclaración que yo necesitaba: es porque estás llamando Report.preview con () que se ejecuta la llamada en lugar de devolver el puntero a función. Sin corchetes que iba a funcionar como se esperaba.
  2. 23

    Otra solución es el uso de ‘obligar’ a construir:

    data-bind="click: Report.preview.bind($data, 'url/to/report')" 

    donde el primer parámetro a bind() se convertirá en el ‘presente’ en la función llamada.

Dejar respuesta

Please enter your comment!
Please enter your name here