修改新建的ionic项目中默认根据id进行的通讯录信息匹配

用cmd命令ionic start myApp tabs生成项目后，在项目中用ionic serve打开项目后如图所示：

代码中默认的是根据数据的id进行的信息匹配：
项目中services.js的代码：

var chats = [{
    id: 10,
    name: 'Ben Sparrow',
    lastText: 'You on your way?',
    face: 'img/ben.png',
    qq:0
  }, {
    id: 11,
    name: 'Max Lynx',
    lastText: 'Hey, it\'s me',
    face: 'img/max.png',
    qq:1
  }, {
    id: 12,
    name: 'Adam Bradleyson',
    lastText: 'I should buy a boat',
    face: 'img/adam.jpg',
    qq:2
  }, {
    id: 13,
    name: 'Perry Governor',
    lastText: 'Look at my mukluks!',
    face: 'img/perry.png',
    qq:3
  }, {
    id: 14,
    name: 'Mike Harrington',
    lastText: 'This is wicked good ice cream.',
    face: 'img/mike.png',
    tiaoUrl:'www.baidu.com',
    qq:4
  }];

  return {
    all: function() {
      return chats;
    },
    remove: function(chat) {
      chats.splice(chats.indexOf(chat), 1);
    },
    get: function(chatId) {console.log(chatId)
      for (var i = 0; i < chats.length; i++) {
        if (chats[i].id === parseInt(chatId)) {
          return chats[i];
        }
      }
      return null;
    }
  };

跳转页面的地址如下：

里面的get方法可以看出是根据id进行匹配的，要想改为根据name进行匹配的话，要进行如下的修改.
首先对services.js中的get方法进行修改：
代码如下：

    //根据名字
    get: function(name) {
      for (var i = 0; i < chats.length; i++) {
        if (chats[i].name === name) {
          return chats[i];
        }
      }
      return null;
    }

找到chats页面，默认的页面名字为tab-chats.html

修改里面

<ion-item class="item-remove-animate item-avatar item-icon-right" ng-repeat="chat in chats" type="item-text-wrap" href="#/tab/chats/{{chat.id}}">
        <img ng-src="{{chat.face}}">
        <h2>{{chat.name}}</h2>
        <p>{{chat.lastText}}</p>
        <i class="icon ion-chevron-right icon-accessory"></i>

        <ion-option-button class="button-assertive" ng-click="remove(chat)">
          Delete
        </ion-option-button>
</ion-item>

href的地址为：#/tab/chats/{{chat.name}}
其实这样就可以实现根据name进行匹配了，但是controllers.js中

.controller('ChatDetailCtrl', function($scope, $stateParams, Chats) {console.log($stateParams)
  $scope.chat = Chats.get($stateParams.chatId);
})

点击其中一条信息进入chat-detail.html页面后，$stateParams打印出的是：{chatId: “Ben Sparrow”}，显然chatId不是name，不怎么进行匹配，为了修改为一致的要做如下的操作：
在app.js中把chatId改为name，如下：

    .state('tab.chat-detail', {
      url: '/chats/:name',
      views: {
        'tab-chats': {
          templateUrl: 'templates/chat-detail.html',
          controller: 'ChatDetailCtrl'
        }
      }
    })

再把controllers.js中关于chat-detail.html页面的js代码中的chatId改为name，如下所示：

.controller('ChatDetailCtrl', function($scope, $stateParams, Chats) {console.log($stateParams)
  $scope.chat = Chats.get($stateParams.name);
})

这样即可实现根据name进行数据的匹配，相应的想要根据别的字段进行数据匹配方法是一样的。