Filtering is not working, kendo grid

kendo.dynamic.linq.DataSourceResult

[AcceptVerbs("GET","POST")]
public DataSourceResult Filter(Models.DataSourceRequest request)
{
    if (request != null)
    {
        request.Filter.Field = request.Filter.Filters.FirstOrDefault().Field;
        request.Filter.Operator = request.Filter.Filters.FirstOrDefault().Operator;
        request.Filter.Value = request.Filter.Filters.FirstOrDefault().Value;
        var o = request;
    }
    var employees = db.Users.OrderBy(ii => ii.Id).Select(x => new RegisterBindingModel()
    {
        Id = x.Id,
        Email = x.Email,
        UserName = x.UserName,
        FirstName = x.FirstName,
        LastName = x.LastName,
        Age = x.Age,
        Phone = x.Phone,
        Department = x.Department
    });
    var i = employees.ToDataSourceResult(request.Take, request.Skip, request.Sort, request.Filter);
    var data = i.Data; // This is contain filtered data
    request.Take = i.Total;
    var d = Json(data);
    System.Diagnostics.Debug.WriteLine(d);
    var aa = data.Cast<RegisterBindingModel>().ToList();
    var b = aa;
    //  return Content(HttpStatusCode.OK,d.Content);
     return employees.ToDataSourceResult(request.Take, request.Skip, request.Sort, request.Filter);
    //return data.Cast <RegisterBindingModel>().ToList();
}

$scope.DS = new kendo.data.DataSource({
           type: "json",
           transport: {
               read: {
                   url: "/api/Employees",
                   dataType: "json",
                   contentType: "application/json",
                   type: "GET",
                   headers: { 'Authorization': 'Bearer ' + sessionStorage.getItem("accessToken") }
               },
               update: {
                   url: "/api/Employees/PUT",
                   dataType: "json",
                   contentType: "application/json",
                   type: "PUT",
                   headers: { 'Authorization': 'Bearer ' + sessionStorage.getItem("accessToken") }
               },
               destroy: {
                   url: "/api/Employees/DELETE",
                   dataType: "json",
                   contentType: "application/json",
                   type: "DELETE",
                   headers: { 'Authorization': 'Bearer ' + sessionStorage.getItem("accessToken") } },
               create: {
                   url: "/api/Employees/POST",
                   dataType: "json",
                   contentType: "application/json",
                   type: "POST",
                   headers: { 'Authorization': 'Bearer ' + sessionStorage.getItem("accessToken") }  },
               parameterMap: function (options, operation) {
                   if (operation !== "read") {
                       console.log(JSON.stringify(options.models));
                       return JSON.stringify(options.models);
                   }}},
           batch: true,
           pageSize: 5,
           serverFiltering: true,
           schema: {
               model: {
                   id: "Id",
                  data: 'Data',
                  total: 'Total',
                 //  errors: 'Errors',
                   fields: {
            Id: { editable: false, nullable: false, type: "number" },
          Email: { editable: true, type: "string" },
           UserName: {editable: true,type: "string"},
  FirstName: { editable: true, type: "string" },
    LastName: { editable: true, type: "string"},
  Age: { editable: true,  validation: { required: true } },
  Phone: { editable: true, validation: { required: true } },
    Department: { editable: true,type: "string"}
    } }
           },
       });

       $scope.mainGridOptions = {
           dataSource: $scope.DS,
           dataBound: function () {
 var data = this.dataSource.view();
           },
           toolbar: ["create"],
           columns: [
               { field: "Email", title: "Email", width: "100px" },
               { field: "UserName", title: "User Name", width: "100px"},
              { field: "FirstName", title: "First Name", width:"100px"},
            { field: "LastName", title: "Last Name", width: "100px" },
               { field: "Phone", title: "Phone", width: "100px" },
               { field: "Age", title: "Age", width: "100px" },
            { field: "Department", title: "Department", width: "100px"},
               {
                   command: [{
                       name: "edit",
                       text: {
                           edit: "Edit",
                           update: "Save",
                           cancel: "Cancel"
                       }
                   }, "destroy"], title: "Actions", width: "150px"
               }
           ],
           filterable: true,
           pageable: {
               refresh: true,
               input: true,
               numeric: false,
               pageSizes: [5, 10, 20, 30, 50, 75, 100, 500, 1000]
           },
           sortable: true,
           resizable: true,
           navigatable: true,
           serverFiltering: true,
           editable: { mode: "inline" },
           filter: function (data) {
               console.log((data));
               console.log((data.filter));
               const requestOptions = {
                   headers: { 'Authorization': 'Bearer ' + sessionStorage.getItem("accessToken") }
               };
               $http.post("/api/Account/Filter", data, requestOptions).then(function (d) {
                   console.log(JSON.stringify(d.data.Data));
                   // $scope.DS.read = d.data.Data;
                   debugger;
                   $scope.mainGridOptions.dataSource.query(d.data.Data);

               }, function () {
               alert("Failed.Please try again.")
                   });
           },

           noRecords: { template: "No results available."}

       };