3

为令人困惑的标题道歉。所以我在这里工作了 multi-select + ng-grid 。

对于任何不确定主/细节范式是什么的人。我从我的网格中选择一行并以某种方式公开它的所有属性,以便从我的网格中查看该行的完整视图(主在网格内,细节是对象属性)

我希望它做类似的事情这

但我似乎无法弄清楚如何获得这种类型的细节视图。我想我需要有某种类型emit/broadcast/on的事件集。所以问题再次是我如何在 angularjs + ng-grid 中使用模态和多项选择来进行主/详细视图?

4

1 回答 1

5

我不确定你想如何创建模态,但有很多选择。一种是角度引导模态。

除此之外,在从 中获取数据方面ng-grid,您可以使用afterSelectionChangegrid 选项委托给一个函数,该函数将在做出选择后触发。

你的 plunker 的这个 fork演示了使用afterSelectionChange.

$scope.gridOptions = { 
  data: 'myData',
  selectedItems: $scope.mySelections,
  multiSelect: true,
  afterSelectionChange: function() {

    $scope.details = $scope.mySelections;
  }
};

$scope.details = null;

然后你可以ng-repeat得到结果:

<button ng-click="show = !show">Show/Hide Details</button>
<div class="selectedItems" ng-show="show">
  You have selected:<br/><br/>
  <div ng-repeat="detail in details">
    name: {{ detail.name }}<br/>
    age: {{ detail.age }}
  </div>
</div>

我希望这有帮助。如果我错过了什么,请告诉我。

编辑:

好的,我将 angular bootstrap modal 集成到这个 plunker中。

看一个没有ng-grid. 你可以在这个 modal plunker中找到它。

于 2013-11-11T15:09:02.140 回答