错误:未知提供程序:来自 ngAnimate 的$animateProvider

Error: Unknown provider: $animateProvider from ngAnimate

本文关键字：ngAnimate animateProvider 来自 程序 未知 错误      更新时间：2023-09-26

我从 ngAnimate 错误中得到未知的提供程序：$animateProvider 在我的 angular.js 文件中。 我在网上检查了解决方案，它说要更改 Angular.Animate.js 文件的版本。 我是否还必须更改 Angular.js 文件的版本。 我目前使用的是 1.0.2 版本。我将 angular.animate.js 版本从 1.0.2 改为 1.2.6。但错误仍在发生。这是我的代码。

<!doctype html>
<html ng-app="MyApp" >
<head>
<meta charset="utf-8">
<title>AngularJS Plunker</title>
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css" integrity="sha384-1q8mTJOASx8j1Au+a5WDVnPi2lkFfwwEAa8hDDdjZlpLegxhjVME1fgjWPGmkzs7" crossorigin="anonymous">
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap-theme.min.css" integrity="sha384-fLW2N01lMqjakBkx3l/M9EahuwpSfeNvV63J5ezn3uZzapT0u7EYsXMjQV+0En5r" crossorigin="anonymous">
<link rel="stylesheet" href="style.css">
</head>
<body ng-controller="MyCtrl">
<form name='myform' ng-init="step = 1">
<div ng-show="step==1">
<div class="row">
<div class="col-sm-6"> <h3 class="bounceInDown">I am</h3> </div>
<div ng-form='step1form'>
<div class="col-sm-6">
<button type="submit" class="OptionButton repeat-animation" ng-disabled="!step1form.$valid" ng-click="step = 4">
<img src="SoundCloud.png" alt="Save icon"/>
<br/>
Self-employed Professional
</button>
<button type="submit" class="OptionButton" ng-disabled="!step1form.$valid" ng-click="step = 2">
<img src="SoundCloud.png" alt="Save icon"/>
<br/>
Self-employed Business
</button>
</div>
</div>
</div>
</div>
<div ng-show="step==2">
<div class="row">
<div class="col-sm-6"> <h3>I need a loan of</h3> </div>
<div ng-form='step2form'>
<div class="col-sm-6">
<button type="submit" class="OptionButton" ng-disabled="!step2form.$valid" ng-click="step = 3">
<img src="SoundCloud.png" alt="Save icon"/>
<br/>
1 lacs
</button>
<button type="submit" class="OptionButton" ng-disabled="!step2form.$valid" ng-click="step = 3">
<img src="SoundCloud.png" alt="Save icon"/>
<br/>
2 lacs
</button>
<button type="submit" class="OptionButton" ng-disabled="!step2form.$valid" ng-click="step = 3">
<img src="SoundCloud.png" alt="Save icon"/>
<br/>
3 lacs
</button>
<button type="submit" class="OptionButton" ng-disabled="!step2form.$valid" ng-click="step = 3">
<img src="SoundCloud.png" alt="Save icon"/>
<br/>
5 lacs
</button>
<button type="submit" class="OptionButton" ng-disabled="!step2form.$valid" ng-click="step = 3">
<img src="SoundCloud.png" alt="Save icon"/>
<br/>
10 lacs
</button>
<button type="submit" class="OptionButton" ng-disabled="!step2form.$valid" ng-click="step = 3">
<img src="SoundCloud.png" alt="Save icon"/>
<br/>
More than 10 lacs
</button>
</div>
</div>
</div>
<div class="row">
<button  ng-click="step = 1">Prev</button>
</div>
</div>
</form>
<script>document.write("<base href='"" + document.location + "'" />");</script>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.0/jquery.min.js"></script>
<script src="bootstrap.min.js" integrity="sha384-0mSbJDEHialfmuBBQP6A4Qrprq5OVfW37PRR3j5ELqxss1yVqOtnepnHVP9aJ7xS" crossorigin="anonymous"></script>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.0.2/angular.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.6/angular-animate.js"></script>
<script src="app.js"></script>
</body>
</html>

这是我的JS文件

var app = angular.module("MyApp", ["ngAnimate"]);
  app.controller('MyCtrl', function($scope, $timeout) {
     $scope.name = '';    
    $scope.items = []; 
    $timeout(function(){
      for(i=0; i<4; i++) {
        $scope.items.push(i);
      }
    }, 10);
  });

您需要确保使用相同的版本，如果您使用的是animate 1.2.6，则还需要使用角度1.2.6：

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.6/angular.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.6/angular-animate.js"></script>

仅供参考：当您正在进行升级时，您不妨尝试升级到最新的旧版本，在撰写本文时，这是 1.2.29 甚至是最新的稳定版 1.5.0

相关文章：