首页>Magento>source

我对我的淘汰ViewModel有疑问.我无法从我在模板中单击的jumpToPage(在ViewModel中定义)中访问"this". subscribeToQuery将"this"显示为UiClass,以便我可以从那里访问其他方法.我想从我的jumpToPage方法做同样的事情。

以下是我的viewmodel:

define(['jquery','ko', 'uiComponent'], function ($, ko, Component) {
        "use strict";
        self.addresses = ko.observableArray([]);
        self.pages = ko.observable(0);
        self.q = ko.observable("");
        return Component.extend({
            initialize : function() {
                this._super();
                this.getAddresses();
                this.subscribeToQuery();
            },
            getAddresses : function(search, page, limit) {
                self.addresses([]);
                $.ajax({
                    url: '/customer/addresses',
                    type: 'GET',
                    data: {
                        p: (page === undefined) ? 1 : page,
                        limit: (limit === undefined) ? 10 : limit,
                        search: search
                    },
                    complete: function (output) {
                        var json = JSON.parse(output.responseText);
                        $.each(json.data, function(index, address) {
                            self.addresses.push(address);
                        });
                        self.pages(json.meta.pages);
                    }
                });
            },
            subscribeToQuery : function() {
                console.log(this);
                var that = this;
                self.q.subscribe(function(value) {
                    clearTimeout(self.addressCall);
                    self.addressCall = setTimeout(function () {
                        that.getAddresses(value);
                    }, 300);
                });
            },
            jumpToPage : function(item, event) {
                console.log(this);
            }
        });
    }
);

这是我的模板:

<input type="text" name="search" placeholder="Zoek een adres" data-bind="value: q, valueUpdate: 'keyup'">
<br />
<br />
<table data-bind="foreach: addresses">
    <tr>
        <td style="border: 2px solid #e0e0e0; background-color: #efefef; border-radius: 10px;">
            <h3 data-bind="text: company"></h3>
            <small data-bind="text: firstname"></small>
            <small data-bind="text: lastname"></small>
        </td>
    </tr>
    <tr><td style="height: 2px;"></td></tr>
</table>
<div data-bind="foreach: new Array(pages())">
    <button data-bind="text: $index()+1, click: $parent.jumpToPage" style="cursor: pointer"></button>
</div>

有人可以帮忙吗? 提前致谢!

最新回答
  • 2019-12-5
    1 #

    旧帖子,但这可能有助于某人。

    您只需在扩展组件之前定义全局变量,并在初始化时分配组件上下文。

    然后你可以 self   在你的功能.

    define(['jquery','ko', 'uiComponent'], function ($, ko, Component) {
        ...
        var self;
        ...
        return Component.extend({
            initialize : function() {
             self = this;
        ...
            jumpToPage : function(item, event) {
              self. subscribeToQuery();
                console.log(this);
            }
    

  • magento2:Magento 2:如何在Modules的LESS文件中使用LESS变量? (不是主题)
  • magento 1.7:仅为所选产品设置自定义送货方式