AngularJS入门教程-循环（四）

前面我们已经学习了控制器的使用，今天我们就来使用控制器，讲一下在AngularJS中，怎么样循环输出一组数据。

开发环境

Sublime Text（建议使用）
AngularJS-1.5.6

示例

//html代码

    
书单
    

        
书名：{{item.name}} , 价格：{{item.price}}
    

//javascript代码
angular.module('count',[])
.controller('newBooks',function($scope){
    $scope.books=[
        {name:"Java编程思想",price:"¥88"},
        {name:"ios开发指南",price:"¥98"},
        {name:"Android开发手册",price:"¥77"}
    ];
});

代码解释：

示例演示的是在页面中显示所有书的名字和价格。

我们先来看一下javascript代码，

创建一个控制器：

angular.module('count',[])
.controller('newBooks',function($scope){
    $scope.books=[
        {name:"Java编程思想",price:"¥88"},
        {name:"ios开发指南",price:"¥98"},
        {name:"Android开发手册",price:"¥77"}
    ];
});

创建一个名为“count”的应用模块，在这个模块中加入了一个名为“newBooks”的控制器，在控制器里，为$scope定义了一个books的属性，将一个对象数组赋给books属性。

下面在来看下html代码

ng-repeat指令：

实现循环输出。其中，item用来接收books中单个对象，在输出name和price两个属性的时候，要使用item对象。如

书名：{{item.name}} , 价格：{{item.price}}

结果展示