2

我是第一次尝试 AngularJS 的基础知识。我第一次尝试 ng-repeat。但是它不起作用。

这是一个不工作的jsfiddle

我已经将代码编写在单个独立的 HTML 文件中,如下所示,并且 angular.js 文件位于同一目录中

<html ng-app> 
<head>
    <script type="text/javascript" src="angular.js"></script>
    <script type="text/javascript">
        var users = [
                      {
                          name:"Mahesh",
                          description:"A geek",
                          age:"22"
                      },
                      {
                          name:"Ganesh",
                          description:"A nerd",
                          age:"25"
                      },
                      {
                          name:"Ramesh",
                          description:"A noob",
                          age:"27"
                      },
                      {
                          name:"Ketan",
                          description:"A psychopath",
                          age:"26"
                      },
                      {
                          name:"Niraj",
                          description:"Intellectual badass",
                          age:"29"
                      }
                    ];
    </script>       
</head> 
<body>
    <div>
        <div data-ng-repeat="user in users">
            <h2>{{user.name}}</h2>
            <div>{{user.description}}</div>
        </div>
    </div>
</body>
</html>
4

4 回答 4

6

users必须引用在当前范围内可访问的属性。范围是 AngularJS 将数据从 HTML 绑定到 HTML 的方式。这将在第二个教程页面的“模型和控制器”一章中进一步解释。在此处查看 Fiddle 的工作版本。

于 2013-08-13T09:52:18.453 回答
1

您还没有定义控制器,例如

myapp.controller("AppController",function($scope){
 $scope.users=[
                      {
                          name:"Mahesh",
                          description:"A geek"
                      },
                    ];
});

/// 你可以调用控制器到视图,例如下面的代码:

<body ng-controller="AppController">
    <div><div data-ng-repeat="user in users">
            <h2>{{user.name}}</h2>
            <div>{{user.description}}</div>
        </div>
    </div>
</body>

您可以通过此链接访问实时示例:http: //jsfiddle.net/9yHjj/

于 2016-08-31T12:27:05.293 回答
0

你的代码应该是这样的......

<html ng-app="app">
<head>
<script type="text/javascript" src="angular.js"></script>
<script type="text/javascript">
var app = angular.module("app",[]).controller(AppController,["$scope",function($scope){
 $scope.users=[
                      {
                          name:"Mahesh",
                          description:"A geek",
                          age:"22"
                      },
                      {
                          name:"Ganesh",
                          description:"A nerd",
                          age:"25"
                      },
                      {
                          name:"Ramesh",
                          description:"A noob",
                          age:"27"
                      },
                      {
                          name:"Ketan",
                          description:"A psychopath",
                          age:"26"
                      },
                      {
                          name:"Niraj",
                          description:"Intellectual badass",
                          age:"29"
                      }
                    ];
}])
    </script>       
</head>
<body ng-controller="AppController">
    <div>
        <div data-ng-repeat="user in users">
            <h2>{{user.name}}</h2>
            <div>{{user.description}}</div>
        </div>
    </div>
</body>
</html>
于 2015-05-14T07:56:46.387 回答
0
<html ng-app="myapp1">
<head>
<script src="http://ajax.googleapis.com/ajax/libs/angularjs/1.4.8/angular.min.js"></script>
<script type="text/javascript">
var myapp = angular.module("myapp1",[]);
myapp.controller("AppController",function($scope){
 $scope.users=[
                      {
                          name:"Mahesh",
                          description:"A geek",
                          age:"22"
                      },
                      {
                          name:"Ganesh",
                          description:"A nerd",
                          age:"25"
                      },
                      {
                          name:"Ramesh",
                          description:"A noob",
                          age:"27"
                      },
                      {
                          name:"Ketan",
                          description:"A psychopath",
                          age:"26"
                      },
                      {
                          name:"Niraj",
                          description:"Intellectual badass",
                          age:"29"
                      }
                    ];
});
    </script>       
</head>
<body ng-controller="AppController">
    <div>
        <div data-ng-repeat="user in users">
            <h2 ng-bind="user.name"></h2>
            <div>{{user.description}}</div>
        </div>
    </div>
</body>
</html>

这段代码应该可以工作

于 2016-05-20T06:29:39.250 回答