我无法让 AngularJS 工作,我在这里错过了什么?



我刚开始在工作中使用Angular,我刚刚在我的新家用电脑上安装了所有东西(Angular, Visual Studio 2013等)。我只是尝试了Angular网站上的一个简单例子,但我似乎无法正确显示任何内容。举个例子,这是我在做的,很简单。HTML:

<head>
<title>Stuff!</title>
<script src="./scripts/angular.min.js"></script>

</head>
<body ng-app="ngApp">
    <table ng-controller="ngAppController">
        <thead>
            <tr>TaaaaZable</tr>
        </thead>
        <tbody>
            <tr ng-repeat="name in names">
                <td>{{name}}</td>
            </tr>
        </tbody>
    </table>
</body>

这是脚本…提前感谢,如果我只是错过了一些愚蠢的东西,我道歉。

<script>
angular.module('ngApp', [])
.controller('ngAppController', function ($scope) {
    $scope.names = [
        { name: 'John', age: 25, gender: 'boy' },
        { name: 'Jessie', age: 30, gender: 'girl' },
        { name: 'Johanna', age: 28, gender: 'girl' },
        { name: 'Joy', age: 15, gender: 'girl' },
        { name: 'Mary', age: 28, gender: 'girl' },
        { name: 'Peter', age: 95, gender: 'boy' },
        { name: 'Sebastian', age: 50, gender: 'boy' },
        { name: 'Erika', age: 27, gender: 'girl' },
        { name: 'Patrick', age: 40, gender: 'boy' },
        { name: 'Samantha', age: 60, gender: 'girl' }];
});
</script>

同样,这是Chrome中的输出:

TaaaaZable{{名称}}

试着这样做,就像你错过了对angular.js或script.js的引用一样

<!DOCTYPE html>
<html>
<head>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.14/angular.min.js"></script>
  <meta charset="utf-8">
  <title>JS Bin</title>
  <script>
angular.module('ngApp', [])
.controller('ngAppController', function ($scope) {
    $scope.names = [
        { name: 'John', age: 25, gender: 'boy' },
        { name: 'Jessie', age: 30, gender: 'girl' },
        { name: 'Johanna', age: 28, gender: 'girl' },
        { name: 'Joy', age: 15, gender: 'girl' },
        { name: 'Mary', age: 28, gender: 'girl' },
        { name: 'Peter', age: 95, gender: 'boy' },
        { name: 'Sebastian', age: 50, gender: 'boy' },
        { name: 'Erika', age: 27, gender: 'girl' },
        { name: 'Patrick', age: 40, gender: 'boy' },
        { name: 'Samantha', age: 60, gender: 'girl' }];
});
</script>
</head>
<body ng-app="ngApp">
    <table ng-controller="ngAppController">
        <thead>
            <tr>TaaaaZable</tr>
        </thead>
        <tbody>
            <tr ng-repeat="name in names">
                <td>{{name.name}} </td> <td>{{name.age}} </td> <td>{{name.gender}}</td>
            </tr>
        </tbody>
    </table>
</body>
</html>

相关内容

最新更新