Question

按照这个小提琴...

我正在创建带有模板的下拉菜单。我正在尝试弄清变量的上下文。

<td><select data-bind="source: roles, value: roleId" data-template="selectRoleTemplate"></select></td>

源roles是视图模型中的一个字段。

值roleId是一个人的字段，这是视图模型的一个字段。

我期望，为了能够在视图模型中处理变量，我们需要类似base.roleId或super.roleId之类的东西，但事实并非如此。如果我们在person对象中添加一个名为roles的字段，则即使视图中没有任何变化，下拉列表也将绑定到该变量。这非常令人困惑。 对此隐藏逻辑有任何解释吗？

<script type="text/x-kendo-template" id="selectRoleTemplate">
    <option data-bind="value: id, text: name" />
</script>

在模板本身中，id和name是人员对象的字段。 是否有一种方法可以从personTemplate脚本标记内部解决viewmodel中的变量？ IE（公司）

Answer 1

您已经遇到了有关源绑定和关联模板的功能，我也已经观察到了这些，但是我还没有看到它们的正式记录。您有一个与您的虚拟机绑定的源。该源中的每个项目又绑定到其单独的模板渲染。但是，如果模板中的绑定不在项目上，而是在虚拟机上，则绑定将在虚拟机上找到属性。

所有内容均与您描述的完全一样。不幸的是，无法在项目或父虚拟机上指定希望绑定在何处工作。剑道首先查看物品，然后查看虚拟机。如果两个属性名称相同，则绑定将始终绑定到该项目。

因此，要从模板内部处理视图模型中的变量，请利用此行为或在源代码中的每个项目上都具有一个属性，该属性可以直接引用vm上的某些内容。

Answer 2

因此，从这里我提供的两个小提琴中可以得到一些补充说明：

http://jsfiddle.net/ztn4dvrL/8

因此，在此版本中，我要做的就是使用kendo的data-attribute属性声明声明data field/value项目。因此，如果您浏览api文档并看到

$('combobox').kendoComboBox({ datasource: data, dataTextField: "Text", dataValueField:"Value"})

可以使用data-*属性声明这些属性中的每一个，以便在显示大写字母的位置显示，例如dataTextField分为data-text-field

http://jsfiddle.net/ztn4dvrL/11/

在此操作中，我正在做似乎有点魔术的操作，并且仅在没有其他解决方案可应用时才应使用。

 <td><select data-bind="source: parent().parent().roles, value: roleId" data-text-field="name" data-value-field="id"></select>
</td>

因此，以您的模型为例，我们有以下tree

根（控制所有元素的一个元素）>>人员（您的数组）>>人员（您的对象）

由于我们位于绑定Person Object的模板中，因此我们仅知道与该项目或以下项目相关的属性。因此，如果我们想提供对该级别以上的项目列表的访问权限，我们可以在此代码之外与视图模型进行交互，或者遍历该树以达到适当的级别。

因此，如果要访问视图模型的root level处的角色数组，我们首先需要转到person对象的父对象，但这只能到达Person数组，因此我们需要一个未定义的对象。但是，如果我们转到Array的父级，我们将返回到root元素，然后可以再次访问所有内容。

所以：

parent().parent().roles equates

至：

{person}.{people array}.{root of viewmodel}.{roles array}

希望这有助于解释我所做的事情。如果有任何遗漏，或者您需要进一步扩展，我将力求补充说明。

Kendo UI模板变量范围

2 个答案: