Child Grid with AngularJS

[Rob ONeill]

Hi,

I am trying to get a ChildGrid to work with angularjs but it nevers seems to render. What am I doing wrong ?

http://jsplayground.syncfusion.com/kj5yk32p

Cheers .... Rob.

[Ragavee U S]

Hi Rob,

Thanks for contacting Syncfusion support.

We analyzed your requirement to render child grid using angularjs. We can define the child grid properties within the scope variable of the childGrid property of ejGrid. Please refer to the below code example.

<div id="Grid" ej-grid

     e-datasource="data" e-columns="columns" e-childgrid="child"

     e-pagesettings-pagesize="8" e-allowpaging="true">
</div>

<script type="text/javascript">

    angular.module('listCtrl', ['ejangular'])

        .controller('PhoneListCtrl', function ($scope) {

            . . . . .

           $scope.child = {

                dataSource: childobj,

                queryString: "EmployeeID",

                columns: [

                            { field: "ChildID", headerText: "Child ID", textAlign: "right", width: 100 },

                            { field: "LastName", headerText: "Last Name", textAlign: "left", width: 100 },

                            { field: "FirstName", headerText: "First Name", textAlign: "left", width: 100 },

                            { field: "City", headerText: "City", textAlign: "left", width: 100 },

                            { field: "Country", headerText: "Country", textAlign: "left", width: 100 }

                ]

            };

        });
</script>

For your convenience, we have modified your sample with the above solution, which can be downloaded from the below location

http://jsplayground.syncfusion.com/503cuce4

Regards,
Ragavee U S.