Question

您好我正在学习角度1，我在开始时遇到问题。

我尝试使用控制器在ng-repeat中使用表格显示数据。 app中的Angular在页面底部甚至{{2 + 2}}处停止工作都不起作用。我无法找到原因。

<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">

    <title>SZYBKI START Z BRACKETS</title>

    <link rel="stylesheet" href="normalize.css">
    <link rel="stylesheet" href="bootstrap.min.css">
</head>
<body ng-app="aplikacja">
<div class="container" ng-controller="kontrolerTabeliSkoczkow">
    <h1 class="text-center">Klasyfikacja skoczków narciarskich</h1>

    <br />

    <div class="input-group">
        <span class="input-group-addon">Szukaj: </span>
        <input type="text" class="form-control" placeholder="np. Adam Małysz" />
    </div>

    <br />

    <div class="table-responsive">
        <table class="table table-hover">
            <thead>
                <tr>
                    <th ng-repeat="naglowek in [
                                   'Imię', 'Rok urodzenia', 'Narodowość'
                                   ]">{{ naglowek }}</th>
                </tr>
            </thead>
            <tbody>
                <tr ng-repeat="skoczkowie in skoczkow">
                    <td>{{skoczek.Name}}</td>
                    <td>{{skoczek.Nation}}</td>
                    <td>{{skoczek.rank}}</td>

                </tr>
            </tbody>
        </table>
    </div>

</div>

{{ 2+2 }}

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

<script>
    var app = angular.module('aplikacja', []);

    app.contoller( 'kontrolerTabeliSkoczkow' , ['$scope', function( $scope ) {
        $scope.skoczkowie = [
         {
           "Name": "HIRSCHER Marcel",
           "Nation": "AUT",
           "rank": 1
         },
         {
           "Name": "JANSRUD Kjetil",
           "Nation": "NOR",
           "rank": 2
         }
        ]
    }];
</script>

<script src="https://code.jquery.com/jquery-3.1.1.min.js"></script>
<script src="bootstrap.min.js"></script>    

</body>
</html>

Answer 1

您忘了关闭控制器。

<script>
    var app = angular.module('aplikacja', []);

    app.contoller( 'kontrolerTabeliSkoczkow' , ['$scope', function( $scope ) {
        $scope.skoczkowie = [
         {
           "Name": "HIRSCHER Marcel",
           "Nation": "AUT",
           "rank": 1
         },
         {
           "Name": "JANSRUD Kjetil",
           "Nation": "NOR",
           "rank": 2
         }
        ]
    }]);
</script>

（最后的'）'

另外，我会声明Jquery BEFORE angular

Answer 2

这是错误的错误，改变了

app.contoller(...)

到

app.controller(...)

并正确关闭：

app.controller("kontrolerTabeliSkoczkow" , ['$scope', function( $scope ) { ... }]);

请参阅链接jsfiddle

Answer 3

控制器末尾的]}和;之间缺少一个括号此外，我不建议使用这种表示法，只是不要在控制器中声明依赖项，我建议这样做：

app.controller("kontrolerTabeliSkoczkow", function($scope){
    /*anything you want to put in it*/
});

您不会被括号，括号和内容弄糊涂，只需在模块中声明您的依赖项，而不是在控制器中声明

简单的控制器使角度不起作用

3 个答案: