Wenzhixin bootstrap-table with Knockout.js

Question

Мы пытаемся привязать события привязки данных к загрузочному столу и не можем заставить его работать. Мы попытались привязать к кнопкам, hrefs, tr и td, но это не срабатывает.

Мы можем успешно заполнить таблицу данными из нашей базы данных с помощью нокаута tho.

 <tbody> 
     <!-- ko foreach: listOfCustomers--> 
     <tr class="clickable-row"> 
      <td> <span class="glyphicon glyphicon-move"></span></td> 
      <td class="text"><button type="button" class="bananen" onclick="App.CustomersScreen.onAfterRenderFunc();"></button></td> 
      <td class="text">{{ name }}</td> 
      <td class="text">{{ town }}</td> 
      <td class="text">{{ mail }}</td> 
      <td class="text">{{ phone }}</td> 
      <td class="text">Motor</td> 
      <td class="text"><span class="glyphicon glyphicon-exclamation-sign"></span></td> 
      <td data-visible="false" 
       data-switchable="false" class="hidden">{{ id }}</td> 
     </tr> 
     <!-- /ko --> 
     </tbody> 

Я надеюсь, что вы поняли вопрос

Спасибо заранее.

Answer 1

Похоже, вы используете неправильный синтаксис привязки данных.

Нокаут использует атрибуты data-bind, тогда как ваш пример HTML выглядит так, как если бы он ожидал JavaScript-шаблонизатора, такого как руля.

Теперь, Knockout позволяет заменить его механизм рендеринга/шаблонирования любым, каким бы вы ни хотели, поэтому можно использовать движок, такой как рули, но, как вы уже не сказали, что в вашем вопросе я полагаю, что вы haven 't поменялся шаблонным двигателем нокаута.

Если я прав, то ваш HTML должен быть чем-то вроде этого:

<tbody> 
    <!-- ko foreach: listOfCustomers--> 
     <tr class="clickable-row"> 
      <td> <span class="glyphicon glyphicon-move"></span></td> 
      <td class="text"><button type="button" class="bananen" onclick="App.CustomersScreen.onAfterRenderFunc();"></button></td> 
      <td class="text" data-bind="text: name"></td> 
      <td class="text" data-bind="text: town"></td> 
      <td class="text" data-bind="text: mail"></td> 
      <td class="text" data-bind="text: phone"></td> 
      <td class="text">Motor</td> 
      <td class="text"><span class="glyphicon glyphicon-exclamation-sign"></span></td> 
      <td data-visible="false" 
     data-switchable="false" class="hidden" data-bind="text: id"></td> 
     </tr> 
    <!-- /ko --> 
</tbody>