This is a migrated thread and some comments may be shown as answers.

Kendo-ui grid in AngularJS application not working

1 Answer 58 Views
Grid
This is a migrated thread and some comments may be shown as answers.
Zak
Top achievements
Rank 1
Zak asked on 11 Jun 2015, 10:31 AM

Hi,

 I have an AngularJS application and I'm trying to add a grid there, but it doesn't work. Nothing appears on the screen and no errors in browser console. Here is my code which works on your Dojo page but doesn't on my page:

HTML:

<kendo-grid k-options="vm.mainGridOptions"></kendo-grid>

 JS:

vm.mainGridOptions = {
            dataSource: {
                type: "odata",
                transport: {
                    read: "http://demos.telerik.com/kendo-ui/service/Northwind.svc/Employees"
                }
            },
            sortable: true,

            columns: [{
                field: "FirstName",
                title: "First Name",
                width: "120px"
            }, {
                    field: "LastName",
                    title: "Last Name",
                    width: "120px"
                }, {
                    field: "Country",
                    width: "120px"
                }, {
                    field: "City",
                    width: "120px"
                }, {
                    field: "Title"
                }]
        };

 The only difference is that I use Controller as syntax so there is no $scope. ‚Äč

I added following references: 

     <link href="/content/assets/kendoui-2015.1.429/kendo.common.min.css" rel="stylesheet" />
    <link href="/content/assets/kendoui-2015.1.429/kendo.default.min.css" rel="stylesheet" />
    <link href="/content/assets/kendoui-2015.1.429/kendo.dataviz.min.css" rel="stylesheet" />
    <link href="/content/assets/kendoui-2015.1.429/kendo.dataviz.default.min.css" rel="stylesheet" />

 

    <script src="~/content/assets/kendoui-2015.1.429/kendo.all.min.js"></script>
    <script src="~/content/assets/kendoui-2015.1.429/kendo.angular.min.js"></script>

 although it seems kendo.angular.min.js is not required.

 

 I have a feeling there is something wrong with kendo-grid directive, as there are no errors when I specify incorrect datasource.

 Can anyone help? 

 Thanks

1 Answer, 1 is accepted

Sort by
0
Zak
Top achievements
Rank 1
answered on 12 Jun 2015, 01:41 PM

Ok, I found the problem, forgot to add 'kendo.directives' to my app module declaration.

 

Tags
Grid
Asked by
Zak
Top achievements
Rank 1
Answers by
Zak
Top achievements
Rank 1
Share this question
or