列表是一个应用广泛在几乎所有移动app中的界面元素。ionList 和 ionItem 这两个指令还支持多种多样的交互模式，比如移除其中的某一项，拖动重新排序，滑动编辑等等。

用法

  Hello, {{item}}!  

高级用法: 缩略图，删除按钮，重新排序，滑动

   
{{item.title}}
 
{{item.description}}
  分享   编辑       

API

属性	类型	详情
delegate-handle (可选)	字符串	该句柄定义带有$ionicListDelegate的列表。
show-delete (可选)	布尔值	列表项的删除按钮当前是显示还是隐藏。
show-reorder (可选)	布尔值	列表项的排序按钮当前是显示还是隐藏。
can-swipe (可选)	布尔值	列表项是否被允许滑动显示选项按钮。默认：true。

---

实例

HTML 代码：

       
   
  
 
Ionic Delete/Option Buttons
 
  Reorder  
      Item {{ item.id }}    Edit   Share       

CSS 代码

body { cursor: url('../style/images/finger.png'), auto; }

JavaScript 代码

angular.module('ionicApp', ['ionic']) .controller('MyCtrl', function($scope) { $scope.data = { showDelete: false }; $scope.edit = function(item) { alert('Edit Item: ' + item.id); }; $scope.share = function(item) { alert('Share Item: ' + item.id); }; $scope.moveItem = function(item, fromIndex, toIndex) { $scope.items.splice(fromIndex, 1); $scope.items.splice(toIndex, 0, item); }; $scope.onItemDelete = function(item) { $scope.items.splice($scope.items.indexOf(item), 1); }; $scope.items = [ { id: 0 }, { id: 1 }, { id: 2 }, { id: 3 }, { id: 4 }, { id: 5 }, { id: 6 }, { id: 7 }, { id: 8 }, { id: 9 }, { id: 10 }, { id: 11 }, { id: 12 }, { id: 13 }, { id: 14 }, { id: 15 }, { id: 16 }, { id: 17 }, { id: 18 }, { id: 19 }, { id: 20 }, { id: 21 }, { id: 22 }, { id: 23 }, { id: 24 }, { id: 25 }, { id: 26 }, { id: 27 }, { id: 28 }, { id: 29 }, { id: 30 }, { id: 31 }, { id: 32 }, { id: 33 }, { id: 34 }, { id: 35 }, { id: 36 }, { id: 37 }, { id: 38 }, { id: 39 }, { id: 40 }, { id: 41 }, { id: 42 }, { id: 43 }, { id: 44 }, { id: 45 }, { id: 46 }, { id: 47 }, { id: 48 }, { id: 49 }, { id: 50 } ]; });