我不能让AngularJS工作,我在这里缺少什么?

时间:2014-07-03 20:43:16

标签: javascript html 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 {{名称}}

1 个答案:

答案 0 :(得分:0)

尝试这样看起来好像你错过了对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>