angularjs - Angular JS - multiple ng-grid in one controller : Master /detail -

All examples which I call the ng-grid mater / extension , such as master / extension in official demo Shows, but they do not show up with two ng-grids.

How can I do this? I do not even know how to start it seems that the grid is bound to $ scope.gridOptions and the $ scope is bound to the controller, so I do not know That's how a controller has two ng-grids.

Does it mean that I need two controllers (connected to a service)?

HTML

  & lt; Body ng-controller = "MyCtrl" & gt; & Lt; Div class = "grid style" ng-grid = "fooGridOptions" & gt; & Lt; / Div & gt; & Lt; Div class = "grid style" ng-grid = "bargid option" & gt; & Lt; / Div & gt; & Lt; / Body & gt;  

JS:

  var app = angular Module ('myApp', ['ngGrid']); App Controller ($ micron), Function ($ radius) {$ scope.foo = [{Name: "Moroni", Age: 50}, {Name: "Tianmum", Age: 43}, {Name: "Yakub", Age : {Name: "moroni", age: 50}, {name: "}", {name: "nephi", age: 2 9}, {name: "anos", age: 34}] $ scope.bar = "Foo", Age: 43}, {Name: "Bar", Age: 27}, {Name: "Fubar", Age: 2 9}, {Name: "John Zone", Age: 34}]; $ Scope .fooGridOptions = {Data: 'foo'}; $ scope.barGridOptions = {Data: 'bar'};});  

The ng-grid guideline ( ng-grid = "myOptionsObject" ) appears in the object that is passed to it. In this case we have only the 'data' property set on the object, but other options are available.