代碼編譯沒有錯誤，但將空對象移動到新列表中

 <!--After loading no error from inspection but the move method not responding--> 
     <!--The HTML---> 
     <!doctype html> 
     <html ng-app='ShoppingListCheckOff'> 
     <html lang="en"> 
      <head> 
      <title>Shopping List Check Off</title> 
      <meta name="viewport" content="width=device-width, initial-scale=1"> 
      <script src="angular.min.js"></script> 
      <script src="app.js"></script> 
      <link rel="stylesheet" href="styles/bootstrap.min.css"> 
      <style> 
       .emptyMessage { 
       font-weight: bold; 
       color: red; 
       font-size: 1.2em; 
       } 
       li { 
       margin-bottom: 7px; 
       font-size: 1.2em; 
       } 
       li > button { 
       margin-left: 6px; 
       } 
       button > span { 
       color: green; 
       } 
      </style> 
      </head> 
     <body> 
      <div class="container"> 
      <h1>Shopping List Check Off</h1> 

      <div class="row"> 
      <!--i think all is ok with this div as everything loaded as i wanted it--> 
     <!--the ng-hide worked also--> 
      <!--To Buy List --> 
      <div class="col-md-6" ng-controller='ToBuyController as itemAdder'> 
      <h2>To Buy:</h2> 

      <ul> 
       <li ng-repeat="item in itemAdder.shoppingList2">Name: {{item.name}} , Quantity: {{item.quantity}} 
       <button class="btn btn-default" ng-click="itemAdder.move()"><span class="glyphicon glyphicon-ok"></span> Bought</button></li> 
      </ul> 

      <div ng-hide="itemAdder.shoppingList2.length" class="emptyMessage">Everything is bought!</div> 
      </div> 
     <!--I want to move the displayed items to this div on click of the bought button--> 
     <!--ng-hide i think it worked--> 
      <!-- Already Bought List --> 
      <div class="col-md-6" ng-controller='AlreadyBoughtController as boughtItem'> 
      <h2>Already Bought:</h2> 
      <ul> 
       <li>Bought <span ng-bind="boughtItem.boughtList.length"></span> 10 cookies</li> 

       <li ng-repeat="item in boughtItem.boughtList">Name: {{item.name}} , Quantity: {{item.quantity}}</li> 
      </ul> 
       <div ng-hide="boughtItem.boughtList.length" class="emptyMessage">Nothing bought yet.</div> 
      </div> 
      </div> 

     </div> 
     </body> 
     </html> 

           <!--Script--> 
     (function() { 
     'use strict'; 


     angular.module('ShoppingListCheckOff', []) 
     .controller('ToBuyController', ToBuyController) 
     .controller('AlreadyBoughtController', AlreadyBoughtController) 
     .service('ShoppingListService', ShoppingListService); 

     <!--This part populated with the buttons ready to be clicked--> 
     ToBuyController.$inject = ['ShoppingListService']; 
     function ToBuyController(ShoppingListService) { 
      var itemAdder = this; 
      itemAdder.shoppingList2 = ShoppingListService.shoppingList2; 
     } 

on click of the button i was expecting the item clicked to move to here 

AlreadyBoughtController.$inject = ['ShoppingListService']; 
     function AlreadyBoughtController(ShoppingListService) { 
     var boughtItem= this; 
      boughtItem.boughtList= ShoppingListService.bought; 
     }

有沒有什麼我在這裏沒做的事？但列表2已填充代碼編譯沒有錯誤，但將空對象移動到新列表中

函數ShoppingListService（）{ var service = this;

  service.shoppingList2 = [ 
      { 
      name: "Milk", 
      quantity: "2" 
      }, 
      { 
      name: "Donuts", 
      quantity: "200" 
      }, 
      { 
      name: "Cookies", 
      quantity: "300" 
      }, 
      { 
      name: "Musli", 
      quantity: "10" 
      }, 
      { 
      name: "Chocolate", 
      quantity: "5" 
      } 
     ];

此部分已填充onclick，但重新調整空的對象。我想的對象搬到這裏的點擊，但東西是不完整的，

service.bought = []; 


    service.remove = function(itemIndex){ 
     service.bought.push(service.shoppingList2.splice(itemIndex,1)); 

    } 

    service.getItems = function(){ 
     return service.bought; 
    }; 


} 


})();

來源

2017-04-01 R.Ovis

你忽略了引號在您的列表中的對象名稱定義我無法弄清楚。爲每個對象定義添加引號，它們需要被寫入，就好像它們在JSON文件中一樣。

service.shoppingList2 = [ 
     { 
     "name": "Milk", 
     "quantity": "2" 
     } 
    ];

https://docs.angularjs.org/guide/controller

來源

2017-04-01 13:04:18

這使得沒有差別或者 service.shoppingList2 = [{ 「名稱」：「牛奶」，「量」：「2」 } ]; –

代碼編譯沒有錯誤，但將空對象移動到新列表中

回答

相關問題