n.sortは関数エラーではありません

Question

私は、syncfusionとscheduleコンポーネントでAngular JSを使用しています。私はasp.netコアで作られた残りのAPIを持っており、私はそれをangeljsでクライアントにしました。私はスケジュールコンポーネントのすべての予定を取得しようとしていますが、スケジュールにバインドするスコープ変数にそれらを割り当てると、エラーが発生します。私はこのエラーをグーグルで試してみましたが、有用なものは何も見つかりませんでした。角度やjavascriptにはあまり習熟していません。

私はアポイントメントオブジェクトを使用して配列を手動で作成すると機能しますが、アポイントサービスから渡したときは機能しません。

これはエラーです：

angular.js:14525 TypeError: n.sort is not a function 
at Object._sortAppById (http://cdn.syncfusion.com/15.1.0.41/js/web/ej.web.all.min.js:10:3533264) 
at Object._dataProcessing (http://cdn.syncfusion.com/15.1.0.41/js/web/ej.web.all.min.js:10:3536745) 
at Object._bindAppointmentsData (http://cdn.syncfusion.com/15.1.0.41/js/web/ej.web.all.min.js:10:3529006) 
at Object._init (http://cdn.syncfusion.com/15.1.0.41/js/web/ej.web.all.min.js:10:3298250) 
at Object.<anonymous> (http://cdn.syncfusion.com/15.1.0.41/js/web/ej.web.all.min.js:10:21539) 
at r.fn.init.n.fn.(anonymous function) [as ejSchedule] (http://cdn.syncfusion.com/15.1.0.41/js/web/ej.web.all.min.js:10:22796) 
at Object.post (http://cdn.syncfusion.com/15.1.0.41/js/common/ej.widget.angular.min.js:10:9542) 
at https://ajax.googleapis.com/ajax/libs/angularjs/1.6.4/angular.min.js:17:3 
at ra (https://ajax.googleapis.com/ajax/libs/angularjs/1.6.4/angular.min.js:85:35) 
at n (https://ajax.googleapis.com/ajax/libs/angularjs/1.6.4/angular.min.js:70:226) "<ej-schedule id="Schedule1" e-width="100%" e-height="525px" e-currentview="currentView" e-currentdate="Date" e-appointmentsettings-datasource="appointments" e-appointmentsettings-id="id" e-appointmentsettings-subject="name" e-appointmentsettings-starttime="startTime" e-appointmentsettings-endtime="endTime" e-appointmentsettings-description="comments" e-appointmentsettings-allday="isAllDay" e-appointmentsettings-recurrence="isRecurrence" e-appointmentsettings-recurrencerule="recurrenceRule" e-directive-name="ejSchedule" class="e-schedule e-js e-scheduleouter e-tooltip" tabindex="1" style="width: 100%; height: 525px;" role="presentation">" 

これは、コントローラ内のサービスからそれらを得るために、私の関数である： `

appointmentsService.getAppointments().then(function (results) { 
     $scope.appointments = results.data; 
     console.log($scope.appointments); 
    }); 

と、これは私のサービスである：

(function() { 

    'use strict'; 

    var app = angular.module("myApp"); 

    app.factory('appointmentsService', ['$http', function($http) { 

     var serviceBase = 'http://localhost:63185/'; 
     var appointmentsServiceFactory = {}; 

     var _getAppointments = function() { 
      return $http.get(serviceBase + 'api/appointments').then(function (results) { 
       return results; 
      }); 
     }; 

     appointmentsServiceFactory.getAppointments = _getAppointments; 

     return appointmentsServiceFactory; 

    }]); 

}()); 

Answer 1

以下のコード例をWeb APIサービスプロジェクトのコントローラファイルに追加してください。

public List<DefaultSchedule> GetData() 
    { 

     List<DefaultSchedule> datas = _context.DefaultSchedule.Take(500).ToList(); 
     return datas; 
    } 
    [HttpPost] 
    public List<DefaultSchedule> Batch([FromBody] EditParams param) 
    { 
     if (param.action == "insert" || (param.action == "batch" && (param.added.Count > 0))) // this block of code will execute while inserting the appointments 
     { 
      DefaultSchedule appoint = new DefaultSchedule(); 
      object result; 
      if (param.action == "insert") 
      { 
       var value = param.value; 
       foreach (var fieldName in value.GetType().GetProperties()) 
       { 
        var newName = fieldName.ToString().Split(null); 
        if (newName[1] == "Id") result = (_context.DefaultSchedule.ToList().Count > 0 ? _context.DefaultSchedule.ToList().Max(p => p.Id) : 1) + 1; 
        else if (newName[1] == "StartTime" || newName[1] == "EndTime") result = Convert.ToDateTime(fieldName.GetValue(value)); 
        else result = fieldName.GetValue(value); 
        fieldName.SetValue(appoint, result); 
       } 
       _context.DefaultSchedule.Add(appoint); 
      } 
      else 
      { 
       foreach (var item in param.added.Select((x, i) => new { Value = x, Index = i })) 
       { 
        var value = item.Value; 
        foreach (var fieldName in value.GetType().GetProperties()) 
        { 
         var newName = fieldName.ToString().Split(null); 
         if (newName[1] == "Id") result = (_context.DefaultSchedule.ToList().Count > 0 ? _context.DefaultSchedule.ToList().Max(p => p.Id) : 1) + 1 + item.Index; 
         else if (newName[1] == "StartTime" || newName[1] == "EndTime") result = Convert.ToDateTime(fieldName.GetValue(value)); 
         else result = fieldName.GetValue(value); 
         fieldName.SetValue(appoint, result); 
        } 
        _context.DefaultSchedule.Add(appoint); 
       } 
      } 
      _context.SaveChanges(); 
     } 
     if ((param.action == "remove") || (param.action == "batch" && (param.deleted.Count > 0))) // this block of code will execute while removing the appointment 
     { 
      if (param.action == "remove") 
      { 
       DefaultSchedule app = _context.DefaultSchedule.Where(c => c.Id == Convert.ToInt32(param.key)).FirstOrDefault(); 
       if (app != null) _context.DefaultSchedule.Remove(app); 
      } 
      else 
      { 
       foreach (var a in param.deleted) 
       { 
        var app = _context.DefaultSchedule.ToList().Where(c => c.Id == Convert.ToInt32(a.Id)).FirstOrDefault(); 
        if (app != null) _context.DefaultSchedule.Remove(app); 
       } 
      } 
      _context.SaveChanges(); 
     } 
     if (param.action == "update" || (param.action == "batch" && (param.changed.Count > 0))) // this block of code will execute while updating the appointment 
     { 
      var value = param.action == "update" ? param.value : param.changed[0]; 
      var filterData = _context.DefaultSchedule.Where(c => c.Id == Convert.ToInt32(value.Id)); 
      if (filterData.Count() > 0) 
      { 
       DefaultSchedule appoint = _context.DefaultSchedule.Single(A => A.Id == Convert.ToInt32(value.Id)); 
       appoint.StartTime = Convert.ToDateTime(value.StartTime); 
       appoint.EndTime = Convert.ToDateTime(value.EndTime); 
       appoint.Subject = value.Subject; 
       appoint.Recurrence = value.Recurrence; 
       appoint.AllDay = value.AllDay; 
       appoint.RecurrenceRule = value.RecurrenceRule; 
      } 
      _context.SaveChanges(); 
     } 
     List<DefaultSchedule> datas = _context.DefaultSchedule.Take(500).ToList(); 
     return datas; 
    } 

angleJSサンプルのフロントエンドページに以下のコード例を含めてください。

<body> 
<div class="content-container-fluid"> 
    <div class="row"> 
     <div class="cols-sample-area"> 
      <div ng-controller="ScheduleCtrl"> 
       <ej-schedule id="Schedule1" e-width="100%" e-height="525px" e-currentview="currentview" e-currentdate="setDate" 
        e-appointmentsettings-datasource="appointments" 
        e-appointmentsettings-id="Id" 
        e-appointmentsettings-subject="Subject" 
        e-appointmentsettings-starttime="StartTime" 
        e-appointmentsettings-endtime="EndTime" 
        e-appointmentsettings-description="Description" 
        e-appointmentsettings-allday="AllDay" 
        e-appointmentsettings-recurrence="Recurrence" 
        e-appointmentsettings-recurrencerule="RecurrenceRule" 
        e-appointmentsettings-applyTimeOffset="false"> 
       </ej-schedule> 
      </div> 
     </div> 
    </div> 
</div> 

<script> 
    angular.module('ScheduleApp', ['ejangular']).controller('ScheduleCtrl', function ($scope) { 
     $scope.appointments = ej.DataManager({ 
      // get the required appointments from Web API service 
      url: "http://localhost:15154/api/Schedule/GetData", 
      crudUrl: "http://localhost:15154/api/Schedule/Batch", 
      adaptor: new ej.UrlAdaptor() 
     }); 
     $scope.setDate = new Date(2014, 11, 5); 
     $scope.currentview = "week"; 
    }); 
</script> 

最初のサービスプロジェクトを実行し、実行状態でそれを保ちます。次に、フロントエンドのHTMLページで上記のコード例のサービスURLを変更します。