我使用AngularJS的js文件出现问题:“错误:[ng:areq]”

时间:2019-04-17 09:59:01

标签: javascript angularjs laravel service controller

我正在编写AngularJS,当我启动应用程序时,每次都会出现此错误。我看着这个很长一段时间,我找不到。我已经检查了文件和模块的名称。有什么想法吗?

错误:http://prntscr.com/nd45d2

文件:app.blade.php

<!DOCTYPE html>
<html lang="en" ng-app="app">
    ...
    <div ng-view> </div>

    @if(Config::get('app.debug'))
        <script src="{{ asset('build/js/vendor/jquery.min.js') }}"></script>
        <script src="{{ asset('build/js/vendor/angular.min.js') }}"></script>
        <script src="{{ asset('build/js/vendor/angular-route.min.js') }}"></script>
        <script src="{{ asset('build/js/vendor/angular-resource.min.js') }}"></script>
        <script src="{{ asset('build/js/vendor/angular-animate.min.js') }}"></script>
        <script src="{{ asset('build/js/vendor/angular-messages.min.js') }}"></script>
        <script src="{{ asset('build/js/vendor/ui-bootstrap-tpls.min.js') }}"></script>
        <script src="{{ asset('build/js/vendor/navbar.min.js') }}"></script>
        <script src="{{ asset('build/js/vendor/angular-cookies.min.js') }}"></script>
        <script src="{{ asset('build/js/vendor/query-string.js') }}"></script>
        <script src="{{ asset('build/js/vendor/angular-oauth2.min.js') }}"></script>
        <script src="{{ asset('build/js/vendor/ui-bootstrap-tpls.min.js') }}"></script>

        <script src="{{asset('build/js/app.js')}}"></script>

        <!-- Controllers -->
        <script src="{{asset('build/js/controllers/login.js')}}"></script>
        <script src="{{asset('build/js/controllers/home.js')}}"></script>
        <script src="{{asset('build/js/controllers/client/clientList.js')}}"></script>

        <!-- Services -->
        <script src="{{asset('build/js/services/client.js')}}"></script>

    @else
        <script src="{{ elixir('js/all.js') }}"></script>
    @endif

    <!-- Routes -->
    <script src="{{asset('build/js/app.js')}}"></script>

</body>
</html>

文件:app.js

var app = angular.module('app', ['ngRoute', 'ngAnimate', 'angular-oauth2', 'ui.bootstrap.tpls', 'app.controllers', 'app.services']);

angular.module('app.controllers', ['ngMessages', 'angular-oauth2']);
angular.module('app.services', ['ngResource']);

app.provider('appConfig', function () {
   var config = {
       baseUrl: 'http://localhost:8000'
   };

   return{
       config: config,
       $get: function(){
           return config;
       }
   }
});

app.config([
    '$routeProvider', 'OAuthProvider', 'OAuthTokenProvider', 'appConfigProvider',
    function($routeProvider, OAuthProvider, OAuthTokenProvider, appConfigProvider){
    $routeProvider
        .when('/login',{
            templateUrl: 'build/views/login.html',
            controller: 'LoginController'
        })
        .when('/home',{
            templateUrl: 'build/views/home.html',
            controller: 'HomeController'
        })
        .when('/clients',{
            templateUrl: 'build/views/client/list.html',
            controller: 'ClientListController'
        });
    OAuthProvider.configure({
        baseUrl: appConfigProvider.config.baseUrl,
        clientId: 'app',
        clientSecret: 'secret', //optional
        grantPath: 'oauth/access_token' //'oauth/token'
    });
    OAuthTokenProvider.configure({
        name: 'token',
        option:{
            secure: false
        }
    });
}]);

app.run(['$rootScope', '$window', 'OAuth', function ($rootScope, $window, OAuth) {
    $rootScope.$on('oauth:error', function (event, rejection) {
        // Ignore 'invalid_grant' error - should be catched on 'LoginController
        if('invalid_grant' === rejection.data.error){
            return;
        }

        // Refresh token when a 'invalid_token' error occurs
        if('invalid_token' === rejection.data.error){
            return OAuth.getRefreshToken();
        }

        return $window.location.href = '/login?error_reason=' + rejection.data.error;
    });
}]);

文件:home.js

angular.module('app.controllers')
    .controller('HomeController', ['$scope', function ($scope) {

    }]);

2 个答案:

答案 0 :(得分:0)

如果您仔细查看控制台,它实际上会在其中说“ HomeController不是函数”

我的猜测是(因为我看不到您将其包含在任何地方),您忘记了在Angular中定义控制器。

我从没使用过Angular(或任何此类框架),所以我可能会误会,但是在网上稍作戳后,我发现了这一点:

   function studentController($scope) {
      $scope.student = {
         firstName: "Mahesh",
         lastName: "Parashar",

         fullName: function() {
            var studentObject;
            studentObject = $scope.student;
            return studentObject.firstName + " " + studentObject.lastName;
         }
      };
   }

答案 1 :(得分:0)

可能是由于build/js/app.js被两次加载而发生的错误:

  • 第一次在控制器之前加载
  • 第二次在<!-- Routes -->评论之后加载。

尝试消除第二个负担build/js/app.js,看是否是根本原因。