2012-10-02 21 views
9

Tengo una necesidad de enlazar algo de HTML a un objeto, pero mi problema es que no conozco las propiedades del objeto en el momento del desarrollo.knockout JS se une a las propiedades del objeto

que tienen una propiedad selectedItem en mi modelo de vista principal que he unido a una sección en mi HTML:

<div data-bind="with: selectedItem"> 

</div> 

Ahora quiero para generar una tabla basada en el nombre de propiedad y de propiedad valores:

<div data-bind="foreach: [WHAT DO I PUT HERE?]"> 
    <label class="control-label"><span data-bind="text: [OR HERE?]" /></label> 
</div> 

No tengo ni idea de cómo hacerlo. Cualquier ayuda es muy apreciada.

Además, ampliándolo ligeramente, me gustaría manejar las propiedades del objeto encuadernado de manera diferente, como si la propiedad fuera solo un tipo primitivo, solo lo muestre, pero si es otro objeto/matriz, entonces maneje especialmente.

¿Se puede hacer esto?

Respuesta

4

Here es un ejemplo de trabajo que usa computable observable para seleccionar en tiempo de ejecución los datos que se mostrarán. Los templates seleccionados dinámicamente también se utilizan para representar los datos de acuerdo con el tipo de datos a renderizar (matriz o escalar).

+0

Este es un buen comienzo, pero fallará para ver exactamente cómo esto me dará acceso a las propiedades del modelo de vista que no conozco en el momento del diseño. ¿Puedes por favor elaborar? – Mark

+1

Claro. La propiedad "seleccionada" contiene el nombre de la propiedad para seleccionar en el modelo de vista (se puede cambiar en tiempo de ejecución). Al cambiar este valor (observable) se activará la actualización de los "datos" de la propiedad (observable computable). Esta última propiedad selecciona dinámicamente (ver _self [selección] _) los datos (list1 o item1) para representar usando la plantilla correspondiente. Espero que esto aclare el ejemplo. – gbs

+0

Ah, veo lo que has hecho, gracias. Pero tal vez estoy entendiendo mal tus pensamientos, o tal vez no he descrito el tema lo suficientemente bien. Si la clase Modelo tiene propiedades X (en tu caso 2 pero la mía tiene alrededor de 20), quiero enumerar todas las propiedades y elegir una plantilla según el tipo de esa propiedad. En su ejemplo, ha codificado las propiedades en la lista de selección, donde como no las conozco ... ¿tiene sentido? – Mark

13

Si alguien más está buscando vincular las propiedades de un objeto simple. Puede hacerlo de esta manera ...

<table> 
    <tbody data-bind="foreach: arrayOfObjects"> 
     <tr data-bind="foreach: Object.keys($data)"> 
      <td data-bind="text: $parent[$data]"></td> 
     </tr> 
    </tbody> 
</table> 

nota: object.keys no es compatible con los navegadores más antiguos, pero se puede usar esto para añadir compatibilidad hacia atrás http://whattheheadsaid.com/2010/10/a-safer-object-keys-compatibility-implementation

Cuestiones relacionadas