【一起学AngularJS】第五章、过滤循环器

在上一章中我们为了打牢基础做了很多的工作，所以这一章我们来学一点轻松的。我们将添加为这个网站应用添加全文搜索功能（没错，会很轻松的）。另外，结束之后我们还会写一个端到端(End to end)的测试，因为它是开发人员的好帮手。它会始终帮你监视着你的应用，并且能及时检测回归。
本次页面上的改动是增加了一个搜索框。然后下面展示的手机列表信息将会随着用户输入的搜索条件改变而改变。
代码不用自己写了，直接使用GIT命令切换到step-3

git checkout -f step-3

我们假设你已经运行了之前章节的网站，这时候，你只需要刷新页面就可以访问step-3分支对应的网站页面了。点击这里查看在线的演示。

控制器

无需做任何改动。

模版

app/index.html

<div class="container-fluid">
  <div class="row">
    <div class="col-md-2">
      <!--Sidebar content-->

      Search: <input ng-model="query">

    </div>
    <div class="col-md-10">
      <!--Body content-->

      <ul class="phones">
        <li ng-repeat="phone in phones | filter:query">
          {
   {
   phone.name}}
          <p>{
   {
   phone.snippet}}