Knockout "Wenn ViewModel-Eigenschaft enthält 'ein wenig Text'"

Question

Ich war auf die Antwort hier How to check contain in knockout verlassen, aber es scheint für eine veraltete Version von Knockout zu sein. Ich versuche, wie etwas zu tun:

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

Wo das fontawesome Symbol in dem ko Betreff Text angehängt wird, wenn das Thema Text das Wort ‚Wichtig‘ enthält. Dies funktioniert jedoch nicht ("contains" ist keine Funktion), und ich habe Mühe, eine "aktuelle" Lösung zu finden.

Answer 1

Dies ist, was ich am Ende mit:

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

Und es funktioniert! Danke, Matt.kaaj. Ich denke Roys Weg ist der Weg zu gehen, wenn ich das an mehreren Stellen mache, aber da ich die Zeichenfolge nur einmal auf der Website nach einem Schlüsselwort überprüfe, ging ich mit der einfachen Inline-Lösung. Danke euch beiden!

Answer 2

Wenn Sie möchten, dass es eine contains Methode für Observables gibt, können Sie add it as a custom function. Oder Sie könnten es einfach zu vm.Subject hinzufügen, oder Sie könnten es inline wie Matt vorgeschlagen.

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 -->