KnockoutJS从可观察数组中删除项目。项目是ul中的listitem,由foreach生成

时间:2012-04-20 19:58:52

标签: javascript knockout.js

使用KnockoutJS,如何从可观察数组中删除项?我希望能够点击listitem,并从数组中删除该项目(从而删除列表)。

下面的代码示例报告:'this.expertise is undefined'。

我是否需要定义某种专业知识对象,然后从内部调用它?

<ul data-bind="foreach: expertise">
    <li data-bind="text: Key, click: $parent.removeExpertise"></li>
</ul>

<script type="text/javascript">
    $(function () {
        function AppViewModel() {

            this.removeExpertise = function (expertise) {
                this.expertise.remove(expertise);

            };

            this.expertise = ko.observable([
                { Key: 'Charles', Value: 'Charlesforth' },
                { Key: 'Denise', Value: 'Dentiste' }
            ]);
        }

        // Activates knockout.js
        jQuery(document).ready(function () {
            ko.applyBindings(new AppViewModel());
        });
    });
</script>

1 个答案:

答案 0 :(得分:17)

当您从孩子调用方法时,this将设置为孩子而不是$parent

有很多方法可以确保使用removeExpertise的适当值调用this。一种简单的方法是使用.bind

看起来像是:

this.removeExpertise = function (expertise) {
    this.expertise.remove(expertise);
}.bind(this);

此外,您希望expertise成为observableArray而不是observable,因为observableArray会公开包含remove函数的数组操作方法。