在knockout viewModel声明中调用jquery函数。 （主要是语法问题）

Question

我有一个名为“应用程序”的viewModel，其中包含申请人的信息。在淘汰视图中看起来像这样：

[！[在此处输入图像说明] [1]] [1]

我尝试遍历此viewModel并根据特定条件过滤掉一个元素。

我最终要做的是，我想在模态中只显示一个“application”元素。

所以，到目前为止，我所做的是，

<a href="#" data-toggle="modal" data-target="#previewApplicantModal" data-bind="attr: { 'data-applicationKey': application.applicationKey }">
    Preview Application
</a>

我添加了一个名为applicationKey的属性，因此它直接检索申请人的“applicationKey”。

我创建了一个jquery函数，通过执行以下操作返回此applicationKey：

                $('#previewApplicantModal').on('show.bs.modal', function (e) {
                    var key = $(e.relatedTarget).data('applicationkey');
                    return key;
                });

它读取“data-applicationKey”并返回相应的applicationKey。

例如，

<a href="#" data-toggle="modal" data-target="#previewApplicantModal" data-bind="attr: { 'data-applicationKey': application.applicationKey }" data-applicationkey="abd263zqe">
    Preview Application
</a>

返回

abd263zqe

之后，我尝试创建一个名为“previewApplication”的新viewModel，它只返回具有“applicationKey”的应用程序元素。我做的是，我循环通过“applications”viewModel并仅在“i.application.applicationKey”等于我上面写的jquery函数返回的“applicationKey”时返回。代码如下所示：

            self.previewApplications = ko.computed(function () {
                return ko.utils.arrayMap(self.applications(), function (i) {
                    if(i.application.applicationKey == THE JQUERY FUNCTION THAT RETURNS THE applicationKey)    
                       return i.application;
                });
            });

所以，我想返回与jquery函数返回的applicationKey具有相同applicationKey的“application”元素，但我不知道如何将它放在语法中。

Answer 1

尝试修改jQuery事件以将密钥存储在previewApplicationKey observable

中

$('#previewApplicantModal').on('show.bs.modal', function (e) {
    var key = $(e.relatedTarget).data('applicationkey');
    viewModel.previewApplicationKey(key);
});

然后在比较函数中检查该值

self.previewApplications = ko.computed(function () {
    return ko.utils.arrayMap(self.applications(), function (i) {
        if(i.application.applicationKey == self.previewApplicationKey())    
            return i.application;
    });
});