Javascript Foreach：切换每个图标-KnockoutJS

我尝试将加号切换为减号，一次之后，该部分立即被单击并展开。遵循我尝试过的代码

<div>
    <ul style="list-style: none">
        <li data-bind="foreach: model">
            <div id="panelHeading">
                <a href="#" data-bind="click: $parent.toggleShow"><i class="fa fa-plus" style="padding-right: 5px;">+</i></a>
                <span data-bind="text: Main"></span>
            </div>
            <div id="panelContent" data-bind="if: show">
                <ul id="clustersList" data-bind="foreach: Sub" style="list-style: none">
                    <li><span style="padding-left: 20px;" data-bind="text: $data"></span></li>
                </ul>
            </div>
        </li>
    </ul>
</div>
=== JS ====
    var viewModel = function() {
      var self = this;
      self.model = ko.observableArray([{
        Main: "Main1",
        Sub: ["hello", "hi"],
        show: ko.observable(false)
      }, {
        Main: "Main2",
        Sub: ["one", "two"],
        show: ko.observable(false)
      }]);
      self.toggleShow = function (item) {
      $('this a').find('i').toggleClass('fa fa-plus fa fa-minus');
        var index = self.model.indexOf(item);
        if (item.show())
            self.model()[index].show(false);
        else
            self.model()[index].show(true);
        }
    }

    ko.applyBindings(new viewModel());

==JS====
var viewModel=函数（）{
var self=这个；
self.model=ko.array([{
Main:“Main1”，
Sub:[“你好”，“你好”]，
显示：可观察（假）
}, {
Main:“Main2”，
分：[“一”、“二”]，
显示：可观察（假）
}]);
self.toggleShow=功能（项目）{
$（'this a'）。find（'i'）。toggleClass（'fa加上fa减'）；
var指数=self.model.indexOf（项目）；
if（item.show（））
self.model（）[index].show（false）；
其他的
self.model（）[index].show（true）；
}
}
应用绑定（新的viewModel（））；

请检查我的小提琴

---

任何建议都会有帮助。

只要根据当前的

show

值更改HTML以应用正确的样式即可：

<i class="fa" data-bind="css: { 'fa-plus': !show(), 'fa-minus': show() }"></i>

---

请参见

根据当前的

show值更改HTML以应用正确的样式

：

<i class="fa" data-bind="css: { 'fa-plus': !show(), 'fa-minus': show() }"></i>

---

请参见

如果使用Knockout，为什么要使用jQuery来操作DOM？添加observable并将其映射到相应的BindingOut如果您使用的是Knockout，为什么要使用jQuery来操作DOM？添加observable并将其映射到相应的绑定