Question

最初我认为它可能是因为ngRoute模块所以我已经添加了依赖性，即使得到相同的错误。作为一个初学者，这是吃我的头....伙计们任何帮助

的index.html

   <!DOCTYPE html>
<html ng-app="myApp">

<head>
    <!-- Latest compiled and minified CSS -->
    <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" integrity="sha384-BVYiiSIFeK1dGmJRAkycuHAHRg32OmUcww7on3RYdg4Va+PmSTsz/K68vbdEjh4u" crossorigin="anonymous">

    <!-- Optional theme -->
    <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap-theme.min.css" integrity="sha384-rHyoN1iRsVXV4nD0JutlnGaslCJuC7uwjduW9SVrLvRYooPp2bWYgmgJQIXwl/Sp" crossorigin="anonymous">
    <title>Contact List Application</title>

</head>

<body>
    <div class="container"  ng-controller="AppCtrl">
        <h1>Contact List for Members</h1>
        <table class="table">
            <thead>
                <tr>
                    <th>Name</th>
                    <th>Email</th>
                    <th>contact</th>
                </tr>
            </thead>
            <tbody>
                <tr ng-repeat="contact in contactlist">
                    <td>{{contact.name}}</td>
                    <td>{{contact.email}}</td>
                    <td>{{contact.number}}</td>
                </tr>
            </tbody>

        </table>
    </div>

    <script  src="https://ajax.googleapis.com/ajax/libs/angularjs/1.6.3/angular.min.js"></script>
    <script  src="https://ajax.googleapis.com/ajax/libs/angularjs/1.6.3/angular-route.min.js"></script>

    <script  src="controllers/controller.js">

    </script>
</body>

</html>

controller.js

angular.module('myApp', ['ngRoute'])
     .controller('AppCtrl', function AppCtrl($scope) {


        person1 = {
            name: 'tm',
            email: 'tm@gmail.com',
            number: '(111) 222-2222'
        };
        person2 = {
            name: 'dk',
            email: 'dik@gmail.com',
            number: '(111) 222-2223'
        };
        person3 = {
            name: 'hey',
            email: 'hey@gmail.com',
            number: '(111) 222-2224'
        };

        var contactlist = [person1, person2, person3];
        $scope.contactlist = contactlist;
    });

测试在线代码编译器上的代码工作正常，但是当我在节点服务器localhost中运行此代码时，它会抛出上述错误。

Answer 1

我认为这是因为您正在使用角度的缩小版本。当您使用缩小版本时，您需要将注入到控制器的依赖项添加为单独的字符串数组，如此

.controller('AppCtrl',['$scope', function AppCtrl($scope) {

应该对所有服务/控制器和指令进行此方法。

原因是当您的脚本缩小时，依赖注入器无法识别哪个服务是哪个。如果你看到你的minify代码，那么你可能会注意到你注入的依赖关系，而不是那里。有一个或两个字符引用相关的依赖。

所以角度的作用是为了找到它们允许我们将依赖关系写为字符串数组的依赖关系。然后，注入器可以轻松识别服务

angular.module('myApp', ['ngRoute'])
     .controller('AppCtrl',['$scope', function AppCtrl($scope) {


        person1 = {
            name: 'tm',
            email: 'tm@gmail.com',
            number: '(111) 222-2222'
        };
        person2 = {
            name: 'dk',
            email: 'dik@gmail.com',
            number: '(111) 222-2223'
        };
        person3 = {
            name: 'hey',
            email: 'hey@gmail.com',
            number: '(111) 222-2224'
        };

        var contactlist = [person1, person2, person3];
        $scope.contactlist = contactlist;
    }]);

无法加载角度js模块获取angular.js：38未捕获错误：[$ injector：modulerr]

1 个答案: