Knockout.js 在对象文本敲除中未定义可观察项

我在敲除viewmodel的对象文本中定义了一个可观察对象。现在，当我运行应用程序时，它无法访问可观察对象

$(function () {
  var viewModel =    {
    Folders: ['Inbox', 'Archive', 'Sent', 'Spam'],
    Title: ko.observable("My View Model Test"),
    SelectedFolder: ko.observable(),
    Mails: ko.observableArray(),
    SelectedMail: ko.observable(),
    SelectedChoices: ko.observable(false),


    navigate: function (folder) {           
        SelectedFolder(folder);
        $.ajax({
            url: "/Api/MailBox",
            data: { folder: folder },
            success: function (data) {
                self.Mails(data);
            },
            statusCode: {
                404: function () {
                    console.log("No Mails");
                }
            }

        });
    }
};
}

---

将单击事件绑定到

导航

功能后。它表示

SelectedFolder

未定义。有人能告诉我为什么无法访问

导航

功能中可观察到的

SelectedFolder

问题可能是调用方法时当前上下文是什么。如果单击事件正在调用该方法，则

此

可能是单击事件绑定到的对象，因此它尝试在该元素上查找SelectedFolder方法

不确定这是否是最好的方法，但这里有一个可能的解决方案：

var viewModel =    {
  Folders: ['Inbox', 'Archive', 'Sent', 'Spam'],
  Title: ko.observable("My View Model Test"),
  SelectedFolder: ko.observable(),
  Mails: ko.observableArray(),
  SelectedMail: ko.observable(),
  SelectedChoices: ko.observable(false)
};

viewModel.navigate = function (folder) {           
  viewModel.SelectedFolder(folder);
  $.ajax({
    url: "/Api/MailBox",
    data: { folder: folder },
    success: function (data) {
      viewModel.Mails(data);
    },
    statusCode: {
      404: function () {
        console.log("No Mails");
      }
    }
});

---

当navigate方法运行并查找SelectedFolder observable时，它首先在navigate方法的上下文中查找它。否则，它将跳转到父上下文，这是在页面准备就绪时运行的匿名函数。如果失败，它会跳转到全局上下文-在那里找不到SelectedFolder，因此它会放弃

要解决此问题，请更改navigate方法以引用viewModel变量，该变量在页面准备就绪时运行的匿名函数上下文中可用：

navigate: function (folder) {           
  viewModel.SelectedFolder(folder);
  $.ajax({
    url: "/Api/MailBox",
    data: { folder: folder },
    success: function (data) {
      viewModel.Mails(data);
    },
    ...

请注意，我还在成功回调中添加了对viewModel的引用，以便它可以找到可观察的邮件

不过，这应该行得通，我建议您考虑更改结构，使导航方法不依赖于特定的全局变量。这里有一个方法：

var myViewModel = function() {
    var self = this;
    self.Folders = ['Inbox', 'Archive', 'Sent', 'Spam'];
    self.Title = ko.observable("My View Model Test");
    self.SelectedFolder = ko.observable();
    self.Mails = ko.observableArray();
    self.SelectedMail = ko.observable();
    self.SelectedChoices = ko.observable(false);

    self.navigate = function (folder) {           
        self.SelectedFolder(folder);
        $.ajax({
            url: "/Api/MailBox",
            data: { folder: folder },
            success: function (data) {
                self.Mails(data);
            },
            statusCode: {
                404: function () {
                    console.log("No Mails");
                }
            }

        });
    };
};

$(function () {
  var ViewModel = new myViewModel();
  ko.applyBindings(viewModel);
});

---

您的想法是正确的，但问题是我想将方法移动到对象文本中。您所做的超出了object literal的范围。那么，难道不可能在对象文本中定义函数吗？