将输入范围绑定到角度表中的特定单元格

Question

在 Angular 中，我有这个简单的模型：

$scope.rdata = [
    {1: 7, 2: 23,3: 9, 4: 13,5: 32},
    {1: 23, 2: 8,3: 67, 4: 11,5: 6},
    {1: 35, 2: 12,3: 24, 4: 17,5: 24},
    ];

我使用 ng-repeat 在 html 中渲染它：

<table>
    <thead>
        <p>Example of xy data rendered</p>
    </thead>
    <tbody>
        <tr ng-repeat="row in rdata">
          <td ng-repeat="c in col">
            <div>{{row[c]}}</div>
          </td>
          <td>
            <input type="range" id="example" min="0" max="1" step="0.01">
          </td>
          <td><div>
            Value compiled: {result of input range value * value in row[c]}
             </div></td>
         </tr>
    </tbody>
</table>

基本上，我想将我最后一个 div 中显示的值（其中写入的 Value 编译）绑定为同一行中的输入范围值与同一行最后一列中的值的乘积。 如果可能的话，我想了解是否有一种方法可以引用位于 x 列和 y 行中的任何值并能够与之交互，将其放入公式等......而无需构建另一个角度模型。

让我知道是否足够清楚我想要实现的目标。

编辑： 我的数据有点像这样：

$scope.financials2 = [ { '2011': 98, '2012': 97, '2013': 100, name: 'Sales' },
  { '2011': -5, '2012': -6, '2013': -7, name: 'Costs of Goods Sold' },
  { '2011': 93, '2012': 91, '2013': 93, name: 'Gross Profit' },
  { '2011': -37, '2012': -36, '2013': -35, name: 'Operating Expenses' },
  { '2011': 54, '2012': 55, '2013': 58, name: 'Operating income' } ]

我可能需要重新构造数据的格式。我的想法是按行显示销售额、毛利润等概念，而值显示在按年份分组的列中

所以中间阶段是这样的：

Concept            2011 2012 2013
Sales                98   97  100
Cost of Goods Sold   -5   -6   -7
Gross Profit         93   91   93 

这个想法是我想添加两列，

• 每行都有一个滑块（输入范围），显示增长 率，所以基本上输入范围从 -0.05 到 +0.05
• 另一列显示 2014 年的预测：因此 2014 年销售额 = 2013 年销售额 *（1+ 滑块值），2014 年毛利润 = 2013 年毛利润 *（1+ 滑块值）

所以我们有 2 个额外的列，第一列包含每一行的滑块，第二列显示 2013 列乘以滑块值的结果。 希望现在更清楚了。

Answer 1

您似乎试图到达这里有两个部分。第一个是如何获取输入字段中的值，第二个是如何获取row[c]。

对于输入字段，您可以使用 ng-model 将输入的值附加到您的行中。

对于您的对象，最好为每个值定义名称，而不仅仅是{1:1, 2:3, 3: 4}，否则，只需使用数组即可。在提供的示例中，我在这个 jsfiddle 示例中调用了对象 last 中的最后一项。

http://jsfiddle.net/reszjcu2/ - 警告，格式很垃圾。

注意，我必须为行对象提供键和值，因为 ng-repeat 仅适用于数组，而不适用于对象。如果您实际上不打算在对象中包含命名项，则使用数组的另一个原因。