我有一个observableArray属性self.FilteredStudents
,学生有名字和姓氏,我想一起打印。
以下是HTML中的foreach代码:
<div class="row justify-content-center" data-bind="foreach: FilteredStudents">
<div class="col-md-6 col-lg-4">
<div>
<div class="LLUserCard">
<div class="LLUserCardHeader">
<div>$name $lastName</div>
<div></div>
</div>
<div class="LLUserCardBody">
</div>
<div class="LLUserCardFooter">
$enrollmentDate
</div>
</div>
</div>
</div>
</div>
显然上面的代码不起作用,伪代码<div>$name $lastName</div>
只是用来指定我要找的东西。
在所有示例或教程中,我发现他们使用了两个元素,如<td data-bind="text: name"></td><td data-bind="text: lastName"></td>
,但我不想在不同的元素中打印值,我希望它们是一个元素的文本元件。
谢谢。
答案 0 :(得分:2)
你可以在文本绑定上使用计算或纯计算函数或内联函数https://jsfiddle.net/0o89pmju/69/
HTML
<p>
<span data-bind="text: Name"></span>
</p>
<p>
Or
</p>
<span data-bind="text: (firstname() + ' ' + lastname() )"></span>
JS
function viewModel() {
var self = this;
this.firstname = ko.observable('bob');
this.lastname = ko.observable('smith');
self.Name = ko.pureComputed(function () {
return self.firstname() + ' ' + self.lastname()
},this);
}
var vm = new viewModel();
(function($) {
ko.applyBindings(vm); //bind the knockout model
})(jQuery);