Question

我有一个在单击元素时调用的函数，我正在比较两个数组。第一个数组打印到DOM，并带有一个过滤数组的表达式。

车把：

{{#each search(~/budgets, searchValue, 'accountName'):i}}
    <p on-click="compareValues">{{accountName}}</p>
{{/each}}

JS：

Ractive.on('compareValues', function(target) {
    if(Ractive.get(target.keypath + '.accountName') === Ractive.get(target.keypath.replace('budgets', 'accounts') + '.accountName') {
        console.log(true);
    } else {
        console.log(false);
    }
});

我得到的示例target.keypath是"${search(budgets,searchValue,"accountName")}.4"。

我希望能够将此结果数组与另一个也将通过表达式的数组进行比较，因此我尝试使用替换，以便切换正在表达式中使用的数组。

是否只能在已经通过表达式的数组上使用表达式并且已经有结果，因为我在更改数组时未定义？

Answer 1

您可以只使用事件上下文来获取数组中的当前项：

ractive.on('compareValues', function() {
    var current = this.event.context,
        index = this.event.index.i;
});

否则，您可以为搜索定义计算属性：

var r = new Ractive({
    el: document.body,
    template: '#template',
    computed: {
        search: function(){
            var budgets = this.get('budgets'),
                searchValue = this.get('searchValue'),
                searchField = this.get('searchField')

            return budgets.filter(function(each){
                return each[searchField] = searchValue;
            });
        }
    }
});

然后你可以在模板中使用：

{{#each search:i}}
    <p on-click="compareValues">{{accountName}}</p>
{{/each}}

通过api：

ractive.get('search.' + index + '.accountName')

使用ractivejs在keypath中使用帮助器

1 个答案: