Question

我有一个表，该表将显示从服务器发送的结果，但是结果本身具有动态形状。还有另一个API提供嵌套的形状/架构。所以我的HTML看起来像这样：

 <tr ng-repeat="result in results">
     <td ng-repeat="path in schema.paths">{{result[path]}}</td>
 </tr>

当然，这是行不通的，因为path可能是一项，也可能是许多用点划线表示的项目。也就是说，路径可能是nesting1，这可能会起作用，或者可能是nesting1.nesting2.nesting3，这会不起作用。如何在不使用JavaScript中的$compile服务的情况下容纳此用例？

Answer 1

如果我正确理解了这个问题，我认为这里有一个Lodash函数可以为您提供帮助。

它称为get。用法：

var object = { 'a': [{ 'b': { 'c': 3 } }] };

_.get(object, 'a[0].b.c');
// => 3

_.get(object, ['a', '0', 'b', 'c']);
// => 3

_.get(object, 'a.b.c', 'default');
// => 'default'

对于您来说，它可能类似于：

controller.js

import { get } from 'lodash-es';

...

// Your controller code...

...

    this.getResultAtPath = path => get(this.results, path);

template.html

<tr ng-repeat="result in results">
     <td ng-repeat="path in schema.paths">{{ getResultAtPath(path) }}</td>
</tr>

如果您不想承担依赖关系，建议您查看一下get的实现。

Answer 2

如上所述，get函数应该起作用。或者，您可以展平您的“结果”。例如，如果有一个对象： {'a': {'b': 3}} 然后将其展平，如下所示： {'a.b': 3}

这里发布了许多实现，例如： flatten nested object

如何绑定到AngularJS中的可变长度属性

2 个答案: