2012-11-01 9 views
2

Я начал изучать нокауты, и я столкнулся с ошибкой. Редактор Aptana показывает ошибки на:Knockoutjs не работает

data-bind: .... 

свойство тега жалуясь, что это собственный тег. Я обязательно включил все необходимые файлы javascript, а также проверил предыдущий вопрос: knockoutjs template not working. Вот мой код:

<!DOCTYPE html> 
<html> 
    <head> 
     <script type='text/javascript' src='jquery-1.8.2.min.js'></script> 
     <script src='jquery.tmpl.min.js' type='text/javascript'></script> 
     <script src='knockout-2.2.0.js' type='text/javascript'></script> 
    </head> 

    <body> 
     <script> 
      function AppViewModel() { 
       this.firstName = "Bert"; 
       this.lastName = "Bertington"; 
      } 

      ko.applyBindings(new AppViewModel());  
     </script> 
     <p>First name: <strong data-bind="text: firstName"></strong></p> 
     <p>Last name: <strong data-bind="text: lastName"></strong></p> 
    </body> 
</html> 

Даже после игнорирования Aptana и в надежде, что браузер будет показывать я до сих пор не получаю ничего. Я использую Firefox 16, но я также пробовал IE 8, но безрезультатно.

ответ

2

Переместите свой тег сценария под своей разметкой.

<body> 
    <p>First name: <strong data-bind="text: firstName"></strong></p> 
    <p>Last name: <strong data-bind="text: lastName"></strong></p> 
    <script> 
     function AppViewModel() { 
      this.firstName = "Bert"; 
      this.lastName = "Bertington"; 
     } 

     ko.applyBindings(new AppViewModel());  
    </script> 
</body> 
+0

Отличная работа, но почему? Почему сценарий должен быть после разметки? Как это должно быть для всех сценариев, которые я буду писать? –

+1

DOM не загружен до выполнения скрипта. Другой альтернативой было бы обернуть его в функцию [jQuery '' ready'] (http://api.jquery.com/ready/). '$ (function() {ko.applyBindings (новый AppViewModel());});' – sghill

+1

Скриптовые теги, встроенные в вашу разметку, выполняются синхронно с обработкой этой разметки браузером, так как 'sghill' отметил, что элементы DOM не были когда вы пытались применить привязки. Перемещая сценарий в нижнюю часть, вы гарантируете, что элементы DOM, на которые вы нацелились, будут доступны. В качестве альтернативы использование обратного вызова jquery 'ready' гарантирует, что ваш код не будет запущен до загрузки DOM. См. Http: //knockoutjs.com/documentation/observables.html ... поиск активации нокаута. –

Смежные вопросы