Javascript 未捕获错误：[$injector:modulerr]-AngularJS_Javascript_Angularjs

Javascript 未捕获错误：[$injector:modulerr]-AngularJS

javascript angularjs

Javascript 未捕获错误：[$injector:modulerr]-AngularJS,javascript,angularjs,Javascript,Angularjs,我有一个像这样有棱角的锅炉板 <!DOCTYPE html> <html lang="en"> <head> <meta charset="utf-8"> <title>local</title> <meta charset="utf-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge">

我有一个像这样有棱角的锅炉板

<!DOCTYPE html>
<html lang="en">

  <head>

    <meta charset="utf-8">

    <title>local</title>


    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <meta name="author" content="">
    <meta name="csrf-token" value="Mjhs4vz2ysVuHOH2WPbyYRMGQDRIR0QHJeRv7CSs">


    <!-- CDN -->
    <link href="https://maxcdn.bootstrapcdn.com/font-awesome/4.3.0/css/font-awesome.min.css" rel="stylesheet">
    <link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.4/css/bootstrap.min.css" rel="stylesheet">
    <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.5.6/angular.min.js"></script>

    <script type="text/javascript">
      "use strict";


      var myApp = angular.module('myApp', ['ui'], function($interpolateProvider, $httpProvider) {

        $interpolateProvider.startSymbol('[[');
        $interpolateProvider.endSymbol(']]');

        //Setting headers
        $httpProvider.defaults.headers.post['Content-Type'] = 'application/x-www-form-urlencoded;charset=utf-8';
        $httpProvider.defaults.headers.common['X-Requested-With'] = "XMLHttpRequest";
        $httpProvider.defaults.headers.post['X-CSRF-TOKEN'] = $('meta[name=_token]').attr('content');


      });

      myApp.directive('myEnter', function() {
        return function(scope, element, attrs) {
          element.bind("keydown keypress", function(event) {
            if (event.which === 13) {
              scope.$apply(function() {
                scope.$eval(attrs.myEnter);
              });

              event.preventDefault();
            }
          });
        };
      });


      myApp.controller('youtubeController', function youtubeController($scope, $log, $http) {

        $scope.download = function() {
          $scope.data = {
            link: $scope.link,
          };

          $http({
            method: 'PUT',
            url: '/youtube/download',
            data: angular.toJson($scope.data)
          })


          .then(function successCallback(response) {
            console.log("%cSuccess!", "color: green;");
            console.log(response);
            $scope.refresh();
            $scope.showModal = false;
          }, function errorCallback(response) {
            console.log("%cError", "color: red;");
            console.log(response);
          });

        };

      });

    </script>

  </head>

  <body ng-app="myApp" ng-controller="youtubeController">

    <div class="container">
      <div class="row text-center" style="width: 100%;">
        <input type="text" name="link" ng-mdel="link">
        <br>
        <button class="btn btn-link" ng-click="download()">Download</button>
      </div>
    </div>
  </body>

</html>

由于某些原因，我的控制台中不断出现这个错误，我不知道是什么原因造成的

我的建议是：

关于我应该调查什么有什么提示吗

按照错误消息中的URL，您可以找到有关错误含义的更多信息

错误是抱怨模块ui。什么是用户界面？是否确实包含此模块的源JS文件

通过删除对此模块的引用，您似乎遇到了另一个错误：

未定义$

因此，您没有包含jQuery，但是您正在尝试访问jQuery方法

只需遵循此模式，直到消除所有错误。

我已尝试尽可能多地修复您的代码，删除名称“youtubeController”，添加jquery，并创建了一个配置部分。您最好创建一个httpintercepter，并使用$httpProvider.interceptors.push修改您的头

地方的严格使用； var myApp=angular.module'myApp'，[]； myApp.configfunction$interpolateProvider$httpProvider{ $interpolateProvider.startSymbol'['； $interpolateProvider.endSymbol']'； //设置标题 $httpProvider.defaults.headers.post['Content-Type']='application/x-www-form-urlencoded；charset=utf-8'； $httpProvider.defaults.headers.common['X-Requested-With']=XMLHttpRequest； $httpProvider.defaults.headers.post['X-CSRF-TOKEN']=$'meta[name=\u TOKEN]'.attr'content'； }; myApp.directive'myEnter'，函数{ 返回函数范围、元素、属性{ element.bindkeydown按键，functionevent{ 如果event.which==13{ 作用域。$applyfunction{ 范围：$evalattrs.myEnter； }; 违约事件； } }; }; }; myApp.controller'youtubeController'，函数$scope、$log、$http{ $scope.download=函数{ $scope.data={ link:$scope.link， }; $http{ 方法：'放'， url:“/youtube/download”，数据：angular.toJson$scope.data } .Then函数成功回调响应{ 控制台。日志%cSuccess！，颜色：绿色；； console.logresponse； $scope.refresh； $scope.showmodel=false； }，函数errorCallbackresponse{ 控制台。日志%cError，颜色：红色；； console.logresponse； }; }; }; 下载只需更改这一行：

 var myApp = angular.module('myApp', ['ui'], function($interpolateProvider, $httpProvider) {

致：

您不需要ui模块。

这里有数百个问题，所有问题的答案基本相同，这就像问如何解决内存泄漏一样。首先使用angular.js而不是angular.min.js来获得一个有用的错误。这清楚地表明模块“ui”不可用！您要么拼错了模块名，要么忘记加载它。。小提琴中似乎没有ui模块。在控制台中，您在哪里以及如何看到该错误？我试图寻找那些，但我没有看到。正如我在第一条评论中所说的那样。对JavaScript进行故障排除时，请使用完整的库，而不是缩小的库；在本例中，使用angular.js而不是angular.min.js。

 var myApp = angular.module('myApp', [], function($interpolateProvider, $httpProvider) {