實務練習

• 實作刪除按鈕

self.del = function(id) {
    self.carts.splice(id, 1);
};

JS Bin

• 實作總金額

  self.total = function() {
    var total = 0;

    for(var i = 0; i<self.carts.length; i++) {
      total += self.subtotal(self.carts[i].quantity, self.carts[i].price);
    }

    return total;
  }

JS Bin

• 實作批次刪除 & 勾選項目全選

  self.batchDelete = function() {
    var newcarts = [];

    for (var i = 0; i < self.carts.length; i++) {
      var item = self.carts[i];
      if (!item.deleted) {
        newcarts.push(item);
      }
    }

    self.carts = newcarts;
  };

  self.selectAll = function() {
    var isAll = self.isAll;
    for (var i = 0; i < self.carts.length; i++) {
      var item = self.carts[i];
      item.deleted = isAll ? true : false;
    }
  };

JS Bin

• 實作編輯項目數量

JS Bin

• 實作欄位排序

JS Bin, orderBy filter

• 實作清單 highlight & 關鍵字搜尋

JS Bin, filter filter, ngClass