Question

我试图在Chrome中使用angular-spinner Angular JS 1.5.x以及我尝试的每一件事，我发现的每一个Plunker（甚至链接到项目页面的那个）都会因一个错误或另一个错误而失败

我发现的一个讨论说我不应该在spin.js标记中加载<script>，但如果我不知道，那该怎么加载呢？当我没有收到Spinner（或最小化代码中的i）不是构造函数的错误时。我觉得我必须遗漏一些显而易见的东西，但我已经搜索和测试了几个小时，我感觉不太接近解决方案。

如果我使用这个包我真的不在乎，我只想要一个微调器，所以如果angular-spinner被弃用并且有一个可行的替代方案，那我就是为指针感到高兴。感谢。

Answer 1

使用spin.js的第2版：

<script type="text/javascript" src="//unpkg.com/angular/angular.js"></script>
<script type="text/javascript" src="//unpkg.com/spin.js@2"></script>
<script type="text/javascript" src="//unpkg.com/angular-spinner"></script>

The DEMO

var app = angular.module('myapp', ['angularSpinner']);
app.controller('MyController', ['$scope', 'usSpinnerService', '$rootScope',
  function($scope, usSpinnerService, $rootScope) {
    $scope.startcounter = 0;
    $scope.startSpin = function() {
      if (!$scope.spinneractive) {
        usSpinnerService.spin('spinner-1');
        $scope.startcounter++;
      }
    };

    $scope.stopSpin = function() {
      if ($scope.spinneractive) {
        usSpinnerService.stop('spinner-1');
      }
    };
    $scope.spinneractive = false;

    $rootScope.$on('us-spinner:spin', function(event, key) {
      $scope.spinneractive = true;
    });

    $rootScope.$on('us-spinner:stop', function(event, key) {
      $scope.spinneractive = false;
    });
  }
]);

<script type="text/javascript" src="//unpkg.com/angular/angular.js"></script>
<script type="text/javascript" src="//unpkg.com/spin.js@2"></script>
<script type="text/javascript" src="//unpkg.com/angular-spinner"></script>

<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>

Answer 2

有一个错误：https://github.com/urish/angular-spinner/issues/26旋转键无法正常工作。

对我有用的是在数组中注册每个微调器：当您调用.spin（spinnerName）时，只需将{spinnerName：true}添加到某个控制器的数组中，当您调用stop（spinnerName）时，将其更改为{spinnerName：false} 。然后根据ng-if =“ mySpinners ['spinnerName'] == true”这样的表达式，使用ng-if显示/隐藏微调框。

角度旋转器有效吗？

2 个答案: