添加数据

Question

我在AngularJS应用程序中使用了Kendo UI网格，我正在添加，编辑和显示记录，但我无法使分页工作。目前我已将pageSize设置为2，如果我向数据添加新记录，则会在同一页面上显示该记录而不是新记录。

以下是用于配置Kendo UI网格的角度js控制器代码：

            $scope.keyPersonList = new kendo.data.ObservableArray([
{person1: 'Kiran', policyStatusID: 1 },
{person1: 'Kadam', policyStatusID: 2 }]);

$scope.mainGridOptions = {
            dataSource: {
                pageSize: 2,
                schema: {
                    model:
                        {
                            id: "id",
                            fields: {
                                person1: { editable: true, type: "string" },
                                policyStatusID: { editable: true, valuePrimitive: true }
                            }
                        }
                }
                //total: 10,//function () { return $scope.keyPersonList.length; },
                //serverPaging: false,
                //serverSorting: false
            },
            selectable: "row",
            //toolbar: kendo.template(angular.element("#toolbarTemplate").html()),
            toolbar: '<button class="btn btn-default mrn-10-lft" id="btnAddNewPerson" name="btnAddNewPerson" type="button" role="button" ng-click="addNewPerson($event)">Add New<span class="glyphicon glyphicon-plus color-green pad-10-lt"></span></button>',
            sortable: true,
            pageable: {
                previousNext: true,
                numeric: true,
                messages: {
                    empty: "No items",
                    display: "{2} items",
                    pageSizes: true
                }
            },
            height: 400,
            columns: [
                {
                    hidden: true,
                    field: "id"
                }, {
                    field: "person1",
                    title: "Person 1",
                    width: "200px",
                    type: "string",
                    validation: {
                        required: true
                    }
                }, {
                    field: "policyStatusID",
                    title: "Policy Status",
                    width: "75px",
                    editor: function (container, options) {
                        var input = $('<input id="ctrlPolicyStatus" name="policyStatusID" data-text-field="name" data-value-field="name" data-bind="value:' + options.field + '" k-ng-model="policyStatusID">');
                        input.appendTo(container);

                        // initialize a dropdownlist
                        input.kendoDropDownList({
                            dataSource: dropDownDataSource,
                            valuePrimitive: true
                        }).appendTo(container);
                    },
                    validation: {
                        required: true
                    }
                },
                {
                    command:
                        [{ text: "customDelete", className: "btn-person btn-person-Delete", click: deletePersonData },
                        { text: "customArchive", className: "btn-person btn-person-archive", click: archivePersonData },
                        { text: "customUnarchive", className: "btn-person btn-person-unarchive", click: unArchivePersonData }],
                    title: "",
                    width: "40px"
                }
            ],
            editable: true
        };

以下是我的HTML代码：

        <kendo-grid k-options="mainGridOptions" id="grdKeyPeople"
                k-data-source="keyPersonList"
                k-on-change="selected = data">
    </kendo-grid>

提前感谢您的帮助。

Answer 1

问题是，我在mainGridOptions和指令k-data-source中都设置了数据源。我删除了指令k-data-source，它对我有用。