Question

我使用一个模板使其工作得很好，但遇到了一个问题，试图用另一个模板替换我的内部ng-repeat。有点像分组数据或更像嵌套数据。

所以让我在这里简化我的HTML：

  <div data-ng-controller="index.dataGridController" data-ux-datagrid="index.items" class="listA datagrid" data-addons="whichTemplate"  grouped="'focus'">
      <script type="template/html" data-template-name="default" data-template-item="item">
        <div>
            <h3>{{ item.obj.name }}</h3>
             <!--- instead of 
             <ul>
                 <li ng-repeat="listItem in item.focus>{{listitem}}</li>
              </uL
              -->
        </div>
      </script>
      <script type="template/html" data-template-name="innerFocus" data-template-item="item">
        <div>
          <ul>
            <li>{{item.focus.id}}</li>
          </ul>
        </div>
      </script>
  </div>

并且index.items看起来像这样：

[{
    "obj": {
    "name": "someName" 
    }
    "focus": [
    {"id": "something here"},
    {"id": "Another etc"}
    ]
}]



// which template is basically copy and pasted from examples
angular.module('ux').factory('whichTemplate', function () {
     return function (inst) {
        // now we override it with our method so we decide what template gets displayed for each row.
        inst.templateModel.getTemplate = function (item) {
            var name = item.focus ? 'innerFocus' : 'default';
            // now we get the template from the name.
            return inst.templateModel.getTemplateByName(name);
        };
    };
});

尝试使用焦点数组迭代列表。有任何想法吗？我认为这将成为文档中的一个很好的例子。添加小提琴。 http://jsfiddle.net/uftsG/88/ 而不是将所有焦点数组放在一个li i中，而是试图将它们展开，同时在列表上方还有item.obj.name。

Answer 1

我不熟悉ux-data网格。如果你开始使用它，你可以忽略这个答案，但我做了一个小的搜索引擎（纯粹出于学术原因），我最终使用ng-grid来显示数据。我遵循了github文档，最后使用$ scope.getMyData函数使用后端所需的数据启动了@ scope.myDefs。在视图中，您真正需要做的是添加输入字段以获取数据，然后添加带有ng-grid的div类。它非常酷，因为它确保代码是模块化的，并且在视图中没有任何时髦的函数在嵌套的ng-repeats等等上进行。给我带来麻烦的唯一部分是CSS，因为我还不精通boot :)如果你最终对ng-grid感兴趣的话，这里有一些文档。

http://angular-ui.github.io/ng-grid/

使用ux-datagrid，angularJS和嵌套交互

1 个答案: