無法將新數據添加到我的簡單JSON（$ scope.customers）

我剛剛開始瞭解angular.js，所以我真的是一個新手。我不知道是否有語法問題或任何其他簡單的問題，但我無法做到這一點。

我已從Dan Wahlin's tutorial開始。我會用Rodrigo Branas的書。

<html ng-app="customersApp"> 
<head> 
    <title>App</title> 
    <script src="angular.min.js"></script> 
    <script> 
     var app = angular.module('customersApp', []); 

     app.controller('CustomersController', function($scope){ 
      $scope.customers = [ 
       {"id": 1, "name": "Yusuf", "age": 18}, 
       {"id": 2, "name": "Ahmetcan", "age": 17}, 
       {"id": 3, "name": "Ender", "age": 20}, 
       {"id": 4, "name": "Batuhan", "age": 16}, 
      ]; 

      $scope.add = function (name){ 
       $scope.customers.push(angular.copy(name)); 
       delete $scope.name; 
      }; 
     }); 
    </script> 
</head> 
<body> 
    <input type="text" id="name" ng-model="nameTxt"/> <input ng-click="add(nameTxt)" type="submit"/> 
    <table ng-controller="CustomersController"> 
     <tr ng-repeat="cust in customers | filter:nameTxt"> 
      <td>{{cust.name}}</td> 
      <td>{{cust.age}}</td> 
     </tr> 
    </table> 
    <br/> 
    You are looking for: {{nameTxt}} 
</body> 
</html>

除了$ scope.add函數，一切都很完美。我嘗試的是獲取nameTxt並將其添加到$ scope.customers。

我認爲問題出在JSON數據結構和我試圖添加的數據之間。但只是不知道如何解決這個問題。目前，感謝..

編輯：Here is the example of Rodrigo..

來源

2014-10-29 Yusuf Ali Bozkır

問題的原因是，我使用「NG-控制器「參數。我已經定義了標籤內部，但輸入不在表格內部，因爲它必須是。

我已經改變了3行並解決了問題。

<body>

到

<body ng-controller="CustomersController">

所以刪除從表中的NG-控制器參數，下面編輯$ scope.add功能。

$scope.add = function (name){ 
       $scope.customers.push({"name": name}); 
      };

我不知道爲什麼angular.copy不起作用。

來源

2014-10-29 09:36:28

遵循以下步驟：

<input type="text" id="name" ng-model="nameTxt"/> <input ng-click="add()" type="submit"/> 

$scope.add = function(){ 
    $scope.customers.push({"id":$scope.customers.length,"name":nameTxt,"age":"---fill---"}); 
};

來源

2014-10-29 08:59:36

我真的需要那麼多的代碼？當我手動添加angularjs允許我添加沒有ID和年齡.. – 2014-10-29 09:02:26

好吧，但你不能'ng-repeat'當你添加這樣的？ – 2014-10-29 09:04:26

爲什麼不呢？有什麼區別？ – 2014-10-29 09:07:18

使用此代碼：

$scope.add = function (name){ 
       $scope.customers.push({'id':"",'name':name,'age':""}); 

      };

來源

2014-10-29 09:02:12

不起作用..對不起 – 2014-10-29 09:04:34

你必須輸入了控制器的範圍，你也必須推同一類型的對象客戶李ST。您必須相應地計算項目的Id。

我已經對JsFiddle

一個簡單的例子中的HTML

<div ng-controller="CustomersController"> 
<input type="text" id="name" ng-model="nameTxt" /> 
<input ng-click="add(nameTxt)" type="submit" /> 
<table > 
    <tr ng-repeat="cust in customers | filter:nameTxt"> 
     <td>{{cust.name}}</td> 
     <td>{{cust.age}}</td> 
    </tr> 
</table> 
<br/>You are looking for: {{nameTxt}}</div>

守則

var app = angular.module('customersApp', []); 

app.controller('CustomersController', function ($scope) { 
    $scope.customers = [{ 
     "id": 1, 
     "name": "Yusuf", 
     "age": 18 
    }, { 
     "id": 2, 
     "name": "Ahmetcan", 
     "age": 17 
    }, { 
     "id": 3, 
     "name": "Ender", 
     "age": 20 
    }, { 
     "id": 4, 
     "name": "Batuhan", 
     "age": 16 
    }]; 

    $scope.add = function (name) { 
     $scope.customers.push({"id": 5, "name": name, "age": 99}); 
    }; 
});

來源

2014-10-29 09:07:40 Max

同樣的結論，但太遲了1分鐘。這裏的plunkr：http://plnkr.co/edit/2Bg5paMbQVVZD92gupyU？p =預覽 – rllola 2014-10-29 09:10:52

我還會添加以確保您的控制器將您在HTML中定義的所有功能都包含在其中。在你的情況下，add（nameTxt）在你的控制器div之外，但Max在他的演示中糾正了它。 – rllola 2014-10-29 09:13:55

我剛剛意識到這不是關於JSON，而是關於我在ng-controller =「CustomersController」中定義的位置。在標籤裏面定義這個參數之後，問題就解決了。 – 2014-10-29 09:31:19

<div ng-app="customersApp"> 
<input type="text" id="name" ng-model="nameTxt"/> <input ng-click="add(nameTxt)" type="submit"/> 
    <table ng-controller="CustomersController"> 
     <tr ng-repeat="cust in customers | filter:nameTxt"> 
      <td>{{cust.name}}</td> 
      <td>{{cust.age}}</td> 
     </tr> 
    </table> 
    <br/> 
    You are looking for: {{nameTxt}} 
</div> 

    var app = angular.module('customersApp', []); 

    app.controller('CustomersController', function($scope){ 
     $scope.customers = [ 
      {"id": 1, "name": "Yusuf", "age": 18}, 
      {"id": 2, "name": "Ahmetcan", "age": 17}, 
      {"id": 3, "name": "Ender", "age": 20}, 
      {"id": 4, "name": "Batuhan", "age": 16} 
     ]; 

     $scope.add = function (name){ 
     $scope.customers.push({"id":'',"name":name,"age":''}); 

     }; 
    });

來源

2014-10-29 09:15:40 user3811714

無法將新數據添加到我的簡單JSON（$ scope.customers）

回答

相關問題