这个示例的逻辑很直观：当选中不同的选项时，页面会随之展示对应的不同数值。

HTML 代码

  
当选按钮



 
      选取的值为: {{ data.clientSide }}
    

      {{ item.text }}
    

      Serverside, Selected Value: {{ data.serverSide }}
    

      {{ item.text }}
    

Ja vaScript 代码

angular.module('ionicApp', ['ionic'])
.controller('MainCtrl', function($scope) {
$scope.clientSideList = [
    { text: "Backbone", value: "bb" },
    { text: "Angular", value: "ng" },
    { text: "Ember", value: "em" },
    { text: "Knockout", value: "ko" }
  ];
$scope.serverSideList = [
    { text: "Go", value: "go" },
    { text: "Python", value: "py" },
    { text: "Ruby", value: "rb" },
    { text: "Ja va", value: "jv" }
  ];
$scope.data = {
    clientSide: 'ng'
  };
$scope.serverSideChange = function(item) {
    console.log("Selected Serverside, text:", item.text, "value:", item.value);
  };
});

css 代码：

body {
  cursor: url('http://www.runoob.com/try/demo_source/finger.png'), auto;
}

实际呈现的效果如下：