knockout.js - knockoutjs - ¿Cómo acceder a $ parent o $ parents[] en el evento knockout viewmodel click?

knockoutjs $parents

Question

Tengo una situación en la que me gustaría notificar a un abuelo o $ padres [1] de un evento de clic que ocurre en un modelo de vista secundario. Así que básicamente me gustaría poder hacer esto

self.$parents[1].actionTaken

Creo que esto no funciona debido a la vinculación de context vs viewModel, pero me gustaría saber si alguien tiene ideas sobre la forma correcta de hacer algo como esto. Gracias

 self.save = function () {

     //do stuff to self first, then

      self.$parents[1].actionTaken();

};

Answer 1

Alternativamente, puede pasar los parámetros al controlador de eventos de su modelo de vista de la siguiente manera: Cambie su método de save

self.save = function(theParents) {
    theParents[1].actionTaken();
}

y atar su controlador de la siguiente manera:

data-bind="click: function() { $data.save($parents) }"

Para obtener más información, consulte la Nota 2 en la documentación del controlador de clics (debe bajar un poco)

Answer 2

En realidad, las acciones se definen en el modelo de vista en el mundo de los knockout. Y los $ padres / $ datos son ''contexto''. Creo una estructura de datos para demostrar su necesidad. Empresa > Departamento de ventas > Empleados

Puede encontrarlo en este ejemplo de jsfiddle: invocar acción raíz en un evento hijo

Si aún desea hacer esto por algún motivo, también puede definir la función actionTaken () en el contexto de los abuelos (no como un método de modelo de vista). Pero eso puede no ser una forma habitual. Lo que sea, mira esto:

self.company={name:''ABC'', click:function(){self.onCompClicked();}, salesDepartment:{manager:''Mgr'',employees:[''Smith'',''John'']}};

Luego cambia el evento de clic de enlace a esto:

data-bind="text: $data, click: $parents[1].click"

El código actualizado de la 2ª edición está aquí: invocar acción de contexto en evento infantil

Answer 3

Hoy en día (utilizando el nocaut 3.0.0), solo se pueden agregar dos parámetros a la función secundaria (ejecutada por el enlace de clic), al primero se le asignará el modelo de vista actual y al segundo se le asignará el argumento clicks args.

Luego llame a ko.contextFor () y pase el objetivo del evento y tendrá acceso a $ parent a través del objeto de contexto.

this.myChildFunction = function (vm, e) {
  var context = ko.contextFor(e.target);
  context.$parent.myParentFunction();
};

(No sé si esto fue posible durante el tiempo de las otras respuestas ...)

Answer 4

O usa el truco de bind

data-bind="click: $parent.foo.bind($parent)"

Ahora, cuando acceda a su función foo, this palabra clave apuntará al contexto principal.

foo: function(child) {
   this.children.remove(child);
}