Привязка данных в нокауте не работает для нескольких атрибутов - PullRequest
Новая
       35

Привязка данных в нокауте не работает для нескольких атрибутов

0 голосов
/ 15 октября 2018

У меня есть следующий тег div с привязкой данных

Это дает следующую ошибку

Значение привязок: visible: showBannerMessage, style: {backgroundColor: # ffeea8; height: 40px} Сообщение: неверный или неожиданный токен

Где я совершаю ошибку?Спасибо

1 Ответ

0 голосов
/ 15 октября 2018

Значение, передаваемое в привязку style, должно быть допустимым объектом javascript, а не строкой css.Вы допустили две ошибки: пары

  • property: value должны быть разделены ,, а не ;
  • строковые значения должны быть заключены в кавычки.И 40px, и #ffeea8 должны быть заключены в ''.

Т.е. правильная привязка: 

/*              comma -------------v                */
style: { backgroundColor: '#ffeea8', height: '40px'  }
/*            quotes -----^-------^----------^----^ */

Вот воспроизведение вашего ошибочного представления, показывающееошибка, которую вы описали, и правильная, которая включает исправления этих двух изменений: 

// Wrong view
try {
  ko.applyBindings({
    showBannerMessage: true
  }, document.getElementById("wrong"));
} catch(err) {
  console.log("error:", err.message);
}

// Right view:
ko.applyBindings({
  showBannerMessage: true
}, document.getElementById("right"));
<script src="https://cdnjs.cloudflare.com/ajax/libs/knockout/3.4.2/knockout-min.js"></script>

<!-- with errors -->
<div id="wrong" data-bind="visible:showBannerMessage, style:{backgroundColor: #ffeea8; height: 40px}">Hello world</div>

<!-- without errors -->
<div id="right" data-bind="visible:showBannerMessage, style:{ backgroundColor: '#ffeea8', height: '40px' }">Hello world</div>
...