1. 程式人生 > >angularjs陣列增刪改查

angularjs陣列增刪改查

  <center>
   <h2>賬單查詢</h2>
   <input type="text" ng-model="add_id"/>
   <input type="text" ng-model="add_name" />
   <input type="text" ng-model="add_shu" />
   <input type="text" ng-model="add_jia" />
   <button ng-click="tian()">新增</button><br>
   <input type="text" placeholder="查詢" ng-model="mohu" />
   <select ng-model="pai">
    <option value="">- 請選擇 -</option>
    <option value="jia">-價格低到高-</option>
    <option value="-jia">-價格高到低-</option>
   </select>
   <button ng-click="pisan()">批量刪除</button>
   <table border="1" cellpadding="15" cellspacing="0">
    <thead>
     <tr>
      <th><input type="checkbox" ng-model="quan" ng-click="fanxuan()"></th>
      <th>編號</th>
      <th>名稱</th>
      <th>數量</th>
      <th>價錢</th>
      <th>小計</th>
      <th>操作</th>
     </tr>
    </thead>
    <tbody>
     <tr ng-repeat="diao in shang | filter:{name:mohu} | orderBy:pai ">
      <td><input type="checkbox" ng-model="diao.state"></td>
      <td ng-if="">{{$index}}</td>
      <td>{{diao.id}}</td>
      <td>{{diao.name}}</td>
      <td>{{diao.shu}}</td>
      <td>{{diao.jia | currency}}</td>
      <td ng-app="">{{diao.jia*diao.shu}}</td>
      <td><button ng-click="shanchu($index)">刪除</button>
       <button ng-click="xiugai($index)">修改</button>
      </td>