2017-01-05 3 views
0

У меня есть простое приложение, в котором я хочу добавить счетчик. Я следовал инструкциям со страницы документации на GitHub и по какой-то причине я постоянно получаю:Угловой модуль «angularSpinner» не доступен

Failed to instantiate module angularSpinner due to: Error: [$injector:nomod] Module 'angularSpinner' is not available! You either misspelled the module name or forgot to load it. If registering a module ensure that you specify the dependencies as the second argument.

Мое определение приложения:

angular.module('MyApp', ['angularSpinner']); 

Мой HTML руководитель:

<script src="js/spin.js" type="text/javascript"></script> 
<script src="js/angularspinner.js" type="text/javascript"></script> 


<script src="js/MyApp" type="text/javascript"></script> 

Я супер путают на этом этапе. Приложение находится в IFRAME, но я могу видеть на консоли, что загружаются оба скрипта spinner. Любые намеки?

+0

Если я пропускаю регистрационный модуль часть I получите следующую ошибку: Ошибка: [$ injector: unpr] Неизвестный поставщик: usSpinnerServiceProvider <- usSpinnerService <-MyService – cAMPy

ответ

0
angular spinner code should be 
/** 
* angular-spinner version 0.5.0 
* License: MIT. 
* Copyright (C) 2013, 2014, Uri Shaked and contributors. 
*/ 

(function (root) { 
    'use strict'; 

    function factory(angular, Spinner) { 

     angular 
      .module('angularSpinner', []) 

      .factory('usSpinnerService', ['$rootScope', function ($rootScope) { 
       var config = {}; 

       config.spin = function (key) { 
        $rootScope.$broadcast('us-spinner:spin', key); 
       }; 

       config.stop = function (key) { 
        $rootScope.$broadcast('us-spinner:stop', key); 
       }; 

       return config; 
      }]) 

      .directive('usSpinner', ['$window', function ($window) { 
       return { 
        scope: true, 
        link: function (scope, element, attr) { 
         var SpinnerConstructor = Spinner || $window.Spinner; 

         scope.spinner = null; 

         scope.key = angular.isDefined(attr.spinnerKey) ? attr.spinnerKey : false; 

         scope.startActive = angular.isDefined(attr.spinnerStartActive) ? 
          attr.spinnerStartActive : scope.key ? 
          false : true; 

         scope.spin = function() { 
          if (scope.spinner) { 
           scope.spinner.spin(element[0]); 
          } 
         }; 

         scope.stop = function() { 
          if (scope.spinner) { 
           scope.spinner.stop(); 
          } 
         }; 

         scope.$watch(attr.usSpinner, function (options) { 
          scope.stop(); 
          scope.spinner = new SpinnerConstructor(options); 
          if (!scope.key || scope.startActive) { 
           scope.spinner.spin(element[0]); 
          } 
         }, true); 

         scope.$on('us-spinner:spin', function (event, key) { 
          if (key === scope.key) { 
           scope.spin(); 
          } 
         }); 

         scope.$on('us-spinner:stop', function (event, key) { 
          if (key === scope.key) { 
           scope.stop(); 
          } 
         }); 

         scope.$on('$destroy', function() { 
          scope.stop(); 
          scope.spinner = null; 
         }); 
        } 
       }; 
      }]); 
    } 

    if (typeof define === 'function' && define.amd) { 
     /* AMD module */ 
     define(['angular', 'spin'], factory); 
    } else { 
     /* Browser global */ 
     factory(root.angular); 
    } 
}(window)); 

и пожалуйста залежные коды линии (вы должны называете угловой сценарий также) через это ниже формата

<!DOCTYPE html> 
<html> 

<head> 
    <link rel="stylesheet" href="style.css"> 
    <script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.17/angular.min.js"></script> 
    <script type="text/javascript" src="http://fgnass.github.io/spin.js/spin.min.js"></script> 
    <script type="text/javascript" src="angular-spinner.js"></script> 
    <script src="script.js"></script> 
</head> 

<body ng-app="myapp" ng-controller="MyController"> 
    <h1>Hello Spinner!</h1> 
    <input type="button" ng-click="startSpin()" value="Start spinner" /> 
    <input type="button" ng-click="stopSpin()" value="Stop spinner" /> 
    <br />Spinner active: {{spinneractive}}<br />Started: {{startcounter}} times<br /> 
    <span us-spinner="{radius:30, width:8, length: 16}" spinner-key="spinner-1"></span> 
</body> 

</html> 

и следовать этой правильной plnkr: http://plnkr.co/edit/BGLUYcylbIVJRz6ztbhf?p=preview

+0

Это именно то, что я следую, и я все равно получаю ту же ошибку. Я действительно не знаю, что не так ... Единственное различие заключается в том, что, поскольку я использую CRM, у меня есть ограничения для именования webresources, и поэтому мой скрипт angular-spinner.js называется angularSpinner. Может это вызвать проблему? – cAMPy

Смежные вопросы