【问题标题】:Angular ngAnimate throws errorAngular ngAnimate 抛出错误
【发布时间】:2014-12-13 18:01:52
【问题描述】:

我正在尝试使用 ngAnimate 制作一些动画,但我什至无法开始使用它。问题是当我尝试将我的 ngAnimate 依赖项添加到应用程序文件时,它会在控制台中引发此错误并且我的应用程序无法运行。

Uncaught Error: [$injector:unpr] Unknown provider: $$jqLiteProvider <- $$jqLite <- $animate <- $compile
http://errors.angularjs.org/1.3.5/$injector/unpr?p0=%24%24jqLiteProvider%20%3C-%20%24%24jqLite%20%3C-%20%24animate%20%3C-%20%24compileangular.js:63 (anonymous function)angular.js:3950 (anonymous function)angular.js:4097 getServiceangular.js:3955 (anonymous function)angular.js:4097 getServiceangular.js:4129 invokeangular.js:4025 origProvider.$getangular.js:4138 invokeangular.js:3956 (anonymous function)angular.js:4097 getServiceangular.js:4129 invokeangular.js:3956 (anonymous function)angular.js:4097 getServiceangular.js:4129 invokeangular.js:1435 doBootstrapangular.js:1455 bootstrapangular.js:1349 angularInitangular.js:25912 (anonymous function)angular.js:2722 triggerangular.js:2992 eventHandler 

但如果不添加 ngAnimate 依赖项,它就可以正常工作。不知道我在这里做错了什么。

这是我的 app.js

var app = angular.module('myApp', ['ngRoute','ngAnimate']);

app.config(function($routeProvider) {
    $routeProvider
        .when('/home', {
            controller: 'homeCtrl',
            templateUrl: '/partials/home.html'
        })
        .when('/register', {
            controller: 'regCtrl',
            templateUrl: '/partials/register.html'
        })
        .when('/login', {
            controller: 'loginCtrl',
            templateUrl: '/partials/login.html'
        }).when('/', {
            redirectTo: '/home'
        }).otherwise({
            redirectTo: '/register'
        });
});

这是我的html

<!DOCTYPE html>
<html>

<head>
    <title>Angular Tutorial</title>
</head>

<body ng-app='myApp'>
    <div class="container">
        <header>
            <h1>Logo</h1>
            <a href="#/home">Home</a>
            <a href="#/register">Register</a>
            <a href="#/login">Login</a>
        </header>
        <ng-view></ng-view>
    </div>

    <!-- Vendor libraries -->
    <script src="bower_components/angular/angular.js"></script>
    <script src="bower_components/angular-route/angular-route.min.js"></script>
    <script src="bower_components/angular-animate/angular-animate.js"></script>

    <!-- App libraries -->
    <script src="app/app.js"></script>
    <script src="app/controllers/controllers.js"></script>
</body>

</html>

这是我的控制器

app.controller('homeCtrl', function($scope) {
    $scope.message = "Home page"
});

app.controller('regCtrl', function($scope) {
    $scope.message = "Registration message";
    $scope.register = function() {
        alert($scope.fname + "\n" + $scope.lname + "\n" + $scope.email + "\n" + $scope.password);
    };
})

app.controller('loginCtrl', function($scope) {
    $scope.message = "Login message";
    $scope.login = function() {
        alert($scope.myemail + "\n" + $scope.password);
    };
})

提前致谢。

【问题讨论】:

  • 你调用了 angular-animate.js 文件吗?
  • 是的,我确实做到了。在我的 html 中。
  • 查看 index.html 中的链接,如果文件实际重定向,请在控制台中直接单击打开。可能是坏链接。
  • 如果有帮助的话,我正在使用 angular 版本 1.3.5 和 angular animate js 版本 1.3.6。
  • 使用相同的版本,如果版本不同会出现错误

标签: angularjs ng-animate


【解决方案1】:

解决了!!

将我的 angular 版本更新为与 angular animate 版本相同的版本解决了该问题。

【讨论】:

  • 是的!我制作了两个相同的版本并且它有效。
猜你喜欢
  • 2017-08-24
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 2012-11-21
  • 2017-08-21
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
相关资源
最近更新 更多