Textarea теряет значение при обновлении привязки CSS

Question

У меня есть представление ASP.NET MVC 3, использующее Razor и Knockout.js, которое ведет себя не так, как я ожидаю. У меня есть пара <a> тегов, которые в основном являются ссылками «согласен» / «не согласен», и текстовая область для комментариев. Если пользователь нажимает «не согласен», мы добавляем CSS-класс к текстовой области, чтобы выделить тот факт, что комментарии требуются, когда пользователь не согласен. Проблема возникает, если поле комментариев, поступающее с сервера, имеет значение null или или "", которое всегда является первым посещением страницы пользователем. Если пользователь вводит комментарии и затем нажимает на ссылку «согласен» или «не согласен», комментарии исчезают. Если поле комментариев имеет значение при первой загрузке страницы, комментарии сохраняются, когда пользователь щелкает ссылки. Если я удаляю привязку данных, которая обновляет CSS, все работает нормально.

Вот несколько упрощенная версия кода (я удалил части viewModel, которые не связаны с этим разделом страницы):

<a href="#" onclick="viewModel.meetsCriteria('true'); return false;">
    Agree
</a>
<a href="#" onclick="viewModel.meetsCriteria('false'); return false;">
    Disagree
</a>

<textarea rows="6" 
    data-bind="value: comments(), css: { 'req': meetsCriteria() == 'false' }" 
    name="response.Comments">
</textarea>

...

var viewModel = {
meetsCriteria: ko.observable(''),
comments: ko.observable('')
};

viewModel.meetsCriteria('@Model.MeetsCriteria.ToString().ToLower()');
viewModel.comments('@Model.Comments');

Любые идеи о том, что происходит или как это исправить, приветствуются.

Answer 1

Вы хотите удалить () из value: comments().

Для привязки чтения / записи, такой как value, важно, чтобы вы связывались с фактической наблюдаемой, а не с ее значением.В вашем случае привязка получает значение наблюдаемых комментариев и не сможет читать / записывать фактические наблюдаемые.