2012-10-02 17 views
9

Mam potrzebę wiązania niektórych HTML do obiektu, ale moim problemem jest to, że nie znam właściwości obiektu w czasie programowania.nokaut JS bind do właściwości obiektu

Mam właściwość selectedItem w moim głównym modelu widoku, które mam związany z sekcji w moim HTML:

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

</div> 

teraz chcę wygenerować tabelę na podstawie nazwy właściwości i własności wartości:

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

Nie mam pojęcia, jak to zrobić. Każda pomoc jest bardzo doceniana.

Ponadto, nieznacznie rozszerzając to, chciałbym obsługiwać właściwości obiektu związanego inaczej, na przykład, jeśli właściwość jest tylko typem pierwotnym, po prostu wypisz ją, ale jeśli jest to inny obiekt/tablica, a następnie uchwyt to specjalnie.

Czy to można zrobić?

Odpowiedz

4

Here to działający przykład, w którym można obliczyć wartość , aby wybrać w czasie wykonywania dane do wyświetlenia. Dynamicznie wybrane templates są również używane do renderowania danych zgodnie z typem danych do renderowania (tablica lub skalar).

+0

Jest to dobry początek, ale ja nie aby zobaczyć dokładnie, w jaki sposób zapewni mi to dostęp do właściwości modelu widoku, którego nie znam w czasie projektowania. Czy mógłbyś to rozwinąć? – Mark

+1

Pewnie. Właściwość "selected" zawiera nazwę właściwości do wyboru w viewmodel (można zmienić w czasie wykonywania). Zmiana tej wartości (obserwowalna) spowoduje aktualizację właściwości "danych" (obliczona obserwowalna). Ta ostatnia właściwość dynamicznie wybiera (patrz _self [selection] _) dane (list1 lub item1) do renderowania za pomocą odpowiedniego szablonu. Mam nadzieję, że to wyjaśnia przykład. – gbs

+0

Ach, widzę, co zrobiłeś, dzięki. Ale może brakuje mi zrozumienia twoich myśli, a może nie opisałem tego wystarczająco dobrze. I klasa Model ma właściwości X (w twoim przypadku 2, ale moja ma około 20), chcę wyświetlić wszystkie właściwości i wybrać szablon na podstawie typu tej właściwości. W twoim przykładzie mocno zakodowałeś właściwości na liście wyboru, gdzie tak jak ja ich nie znam ... czy to ma sens? – Mark

13

Jeśli ktoś jeszcze chce związać właściwości prostego obiektu. Można zrobić to w ten sposób ...

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

note: object.keys nie jest obsługiwana w starszych przeglądarkach, ale można to wykorzystać, aby dodać wstecznej kompatybilności http://whattheheadsaid.com/2010/10/a-safer-object-keys-compatibility-implementation

Powiązane problemy