Knockout.js语法

Question

我是Javascript MVC框架Knockout.js的初学者

来自传统的Javascript(和一些jQuery经验),我在理解语法学习Knockout.js时遇到了困难

考虑下面的陈述;

风景:

<ul class="folders" data-bind="foreach: folders">
<li data-bind="text: $data, 
               css: { selected: $data == $root.chosenFolderId() },
               click: $root.goToFolder"></li></ul>

查看型号:

function WebmailViewModel() {
    // Data
    var self = this;
    self.folders = ['Inbox', 'Archive', 'Sent', 'Spam'];
    self.chosenFolderId = ko.observable();

    // Behaviours    
    self.goToFolder = function(folder) { self.chosenFolderId(folder); };    
};

你能解释一下这些陈述是什么(特别是$ data,$ root)吗？该声明的作用self.chosenFolderId(folder);是什么？

Answer 1

$ data和$ root关键字通常由KO使用.当您在数组(数据绑定)上使用foreach时,KO会<li>为数组中的每个元素创建一个.

在这种情况下,$ data是数组的当前项(如folders [i]),$ root是父元素.对于您来说,文件夹是ViewModel的一个字段:$ data =迭代时的当前文件夹(viewModel.folder [i])$ root = viewModel

self.chosendFolderId(文件夹)执行viewModel selectedFolderId方法.代码使用self来保持viewModel值,因为在函数中关键字"this"不是viewModel而是方法的发送者.这是一个关闭.

编辑:$父关键字是树的普遍级别.$ root关键字是顶层树的级别.

viewModel {
  topObjects : ko.observableArray()
}

viewModel.topObjects.push({
  Objects : ko.observableArray()
});

如果我们在viewModel.topObjects.Objects上创建foreach,$ parent是topObjects,$ root是viewModel.

谢谢Tjorriemorrie ;-)