Angular混合应用程序，typeerror calendar.fullcalendar不是函数

Question

我正在使用AngularJS和Angular（2+）的应用程序上工作。 在新版本中，我正在使用system.js导入Angular应用程序。 没有system.js导入，日历可以正常工作，但是使用system.js时，存在初始化问题。

我已经尝试过以下calendar = $(elm); 没有运气。

https://github.com/angular-ui/ui-calendar/issues/267

甚至尝试var calendar = $('#calendar') 。

问题似乎不在于认识到存在日历元素。 从我可以推断出记录框架的源代码的角度来看，在正常工作时，Calendar元素在初始化时具有这些类。

div#calendar.calendar.ng-pristine.ng-untouched.ng-valid.ng-isolate-scope.fc.fc-cursor.fc-ltr.fc-unthemed

当前，初始化试图将其用作引发angular.min.js:117 TypeError: calendar.fullCalendar is not a function的日历元素angular.min.js:117 TypeError: calendar.fullCalendar is not a function错误，它仍会找到正确的元素，但不会将类附加到该元素。

div#calendar.calendar.ng-pristine.ng-untouched.ng-valid.ng-isolate-scope

script.ejs

<!-- jQuery -->
<script src="//ajax.googleapis.com/ajax/libs/jquery/2.1.4/jquery.min.js"></script>
<—-! All the AngularJS -—>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.5.6/angular.min.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.5.6/angular-cookies.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/angular.js/1.5.6/angular-animate.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/angular.js/1.5.6/angular-route.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/angular-ui-router/0.3.1/angular-ui-router.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/angular.js/1.5.6/angular-sanitize.min.js"></script>
<script src="http://ajax.googleapis.com/ajax/libs/angularjs/1.5.5/angular-aria.min.js"></script>
<script src="http://ajax.googleapis.com/ajax/libs/angularjs/1.5.5/angular-messages.min.js"></script>
<script src="http://ajax.googleapis.com/ajax/libs/angular_material/1.1.0/angular-material.min.js"></script>
<!-- Moment -->
<script src="https://cdnjs.cloudflare.com/ajax/libs/moment.js/2.18.1/moment.min.js" integrity="sha256-1hjUhpc44NwiNg8OwMu2QzJXhD8kcj+sJA3aCQZoUjg=" crossorigin="anonymous"></script>
<!-- ui calendar -->
<script src="//cdnjs.cloudflare.com/ajax/libs/angular-ui-calendar/1.0.0/calendar.min.js" integrity="sha256-DBa6dvjY39GU4NQ2Ia2CIPVFszxgZ4N3JccyPvJNPLI=" crossorigin="anonymous"></script>
<script src="//cdnjs.cloudflare.com/ajax/libs/fullcalendar/2.7.1/fullcalendar.min.js"></script>

仅限AngularJS应用，index.ejs：

<body>
  <div id="shell" data-ng-app="app" data-ng-controller="shellController">

    …

  </div>


  <%- include partials/scripts %>

</body>

混合应用index.ejs：

<body class="full-width">
  <div id="shell" data-ng-controller="shellController">

  …

  </div>


  <%- include partials/scripts %>

  <script src="node_modules/systemjs/dist/system.src.js"></script>
  <script src="systemjs.config.js"></script>
  <script>
      System.import('app').catch(function(err) { console.error('ERR from import: ’,err); });
  </script>


</body>

我正在使用v2.7.1的fullcalendar和v 1.0.0的angular-ui-calendar。 对于造成此问题的原因的任何帮助，我们将不胜感激，我已经研究了好几天了！

Answer 1

我找到了这篇文章的答案。

如何使用System.js导入Fullcalendar v.3.0.1？

事实证明，问题出在moment.js文件不在system.js配置的meta属性之内。

Angular混合应用程序，typeerror calendar.fullcalendar不是函数

问题描述

1 个解决方案

解决方案1
0 2017-10-02 18:35:41

Angular混合应用程序，typeerror calendar.fullcalendar不是函数

问题描述

1 个解决方案

解决方案1 0 2017-10-02 18:35:41

解决方案1
0 2017-10-02 18:35:41