Нокаут «Если свойство viewModel содержит« некоторый текст »

Question

Я полагался на ответ здесь How to check contain in knockout, но, похоже, для устаревшей версии нокаута. Я пытаюсь сделать что-то вроде:

<li> 
    <span data-bind="text: Subject"></span> 
    <!-- ko if: Subject.contains('Important') --> 
     <i class="fa fa-exclamation-triangle"></i> 
    <!-- /ko --> 
</li> 

Где значок fontawesome добавляется к ко-Subject текст, если это Тема Текст содержит слово «Главное». Однако это не работает («contains» не является функцией), и я изо всех сил пытаюсь найти «современное» решение.

Answer 1

Это то, что я закончил с:

<li> 
    <span data-bind="text: Subject"></span> 
    <!-- ko if: Subject().indexOf('Important') !== -1 --> 
    <i class="fa fa-exclamation-triangle"></i> 
    <!-- /ko --> 
</li> 

И это работает! Спасибо, Мэттькай. Я думаю, что путь Роя - это способ пойти, если это то, что я делаю в нескольких местах, но поскольку я проверяю только строку для ключевого слова один раз на сайте, я пошел с простым встроенным решением. Спасибо вам обоим!

Answer 2

Если вы хотите, чтобы для наблюдаемых использовался метод contains, вы можете add it as a custom function. Или вы можете добавить его только к vm.Subject, или вы могли бы встроить его, как предложил Мэтт.

ko.observable.fn.contains = function (str) { 
 
    return this().indexOf(str) > -1; 
 
}; 
 

 
vm = { 
 
    Subject: ko.observable('This is Important') 
 
}; 
 

 
ko.applyBindings(vm); 
 

 
setTimeout(() => vm.Subject('This is not'), 1500);

<link href="//maxcdn.bootstrapcdn.com/font-awesome/4.2.0/css/font-awesome.min.css" rel="stylesheet" /> 
 
<script src="https://cdnjs.cloudflare.com/ajax/libs/knockout/3.2.0/knockout-min.js"></script> 
 
<span data-bind="text: Subject"></span> 
 
<!-- ko if: Subject.contains('Important') --> 
 
<i class="fa fa-exclamation-triangle"></i> 
 
<!-- /ko -->