在 foreach 中使用键值对的淘汰赛绑定答案

【问题标题】：Knockout Bindings using Key value pair Inside foreach在 foreach 中使用键值对的淘汰赛绑定
【发布时间】：2015-07-18 02:02:50
【问题描述】：

我正在使用 BreezeJs 进行淘汰赛，以便从我的本地数据库中检索和存储数据。我在这里面临的问题是 foreach 绑定中的键值绑定。我想要做的是在文本框中显示“名称”属性，然后从我的数据库中检索到相应的“Id”属性。

“operator”[成功从微风访问]是一个在数据库中定义的属性，其 int 值为 1，因此我的文本框必须显示来自“operators”的相应值 [在我的 javascript 文件中定义] 即，一条记录的“减法”

var operators = [
{id: 0, name: 'addition'},
{id: 1, name: 'subtraction'},
{id: 2, name: 'division'},
{id: 3, name: 'multiplication'}
   ];

我的 HTML 绑定

<div data-bind="foreach: jobs">
      <div>
        <label>FirstNumber :</label>
        <input data-bind="value: first_no" />
    </div>

         <div>
        <label>operator :</label>
         <input type="text" data-bind="text:operators.name, value: $root.operator"/>
    </div>
     <div>
        <label>Second Number:</label>
        <input data-bind="value: second_no" />
    </div><div>
        <label>Result :</label>
        <input data-bind="value: result" />
    </div></div>

这些result,second_no,operator,first_no 是我的列名数据库和jobs 是observableArray。

我知道我不正确，但我需要找到一些方法来解决上述问题。

注意：我正在使用 breezeJS 从数据库中获取和存储数据，这就是我提到它的标签的原因，尽管上述问题是敲除而不是轻而易举。

【问题讨论】：

您的绑定中没有任何 foreach，您正在尝试从 operators 数组绑定不存在的 name 属性...如果您不清楚，我们如何帮助您？
现在快检查我的错误，我复制了一些东西，
如果我使用标签我会得到答案，但如何使用标签<select data-bind="options: $root.operators, optionsText: 'name', optionsValue: 'id', value: $root.operator"/> 做同样的事情
data-bind="value: $root.operators[operator].name"
史蒂夫：不行，不行

标签： javascript knockout.js breeze

【解决方案1】：

在没有看到其余代码的情况下，您的代码最大的问题是使用 with 绑定而不是 foreach。 foreach 用于迭代，with 用于改变上下文。

<div data-bind="foreach: jobs">
      <div>
        <label>FirstNumber :</label>
        <input data-bind="value: first_no" />
    </div>

         <div>
        <label>operator :</label>
         <input type="text" data-bind="text:operators.name, value: $root.operator"/>
    </div>
     <div>
        <label>Second Number:</label>
        <input data-bind="value: second_no" />
    </div><div>
        <label>Result :</label>
        <input data-bind="value: result" />
    </div>
</div>

【讨论】：