Angularjs - 無法動態推動兒童項目

我有一個簡單的嵌入式json嵌入到我的html文件中，我想要使用窗體動態地插入一些數據。Angularjs - 無法動態推動兒童項目

我能夠將數據插入父級別，但無法插入到子級別。我做錯了什麼？

下面是代碼：

<div class="container" ng-app="myApp" ng-controller="myCtrl"> 
     <label>Enter Data</label> 
     <input ng-model="name" type="text"> 
     <input ng-model="rollno" type="number"> 
     <input ng-model="id" type="text"> 
     <button ng-click="addData(data)">Enter Data</button> 
     <table class="table table-bordered"> 
      <tr> 
       <th>Sr No</th> 
       <th>Name</th> 
       <th>Roll No</th> 
       <th>Subjects</th> 
       <th>Delete</th> 
      </tr> 
      <tr ng-repeat="data in myData"> 
       <td>{{$index+1}}</td> 
       <td>{{data.name}}</td> 
       <td>{{data.rollno}}</td> 
       <td ng-repeat="subject in data.subjects">{{subject.id1}}, {{subject.id2}}</td> 
       <td><a href="" ng-click="removeData($index)">remove</a></td> 
      </tr> 
     </table> 
     </div> 
     <script> 
      var app = angular.module('myApp',[]); 
      app.controller('myCtrl',function($scope){ 
       $scope.myData =[{"name":"Jon","rollno":123,"subjects":[{"id1":"Maths","id2":"Hindi"}]},{"name":"Ron","rollno":234,"subjects":[{"id1":"English","id2":"Hindi"}]}]; 
       $scope.addData = function(data){ 
        $scope.myData.push({name:$scope.name,rollno:$scope.rollno,id1:$scope.id1}); 
       } 
       $scope.removeData = function(index){ 
        $scope.myData.splice(index, 1); 
       } 
      }); 
     </script>

來源

2016-09-25 user3719049

你說的父母和孩子的水平是什麼意思？你在談論JSON數據嗎？請舉一個你喜歡怎麼樣的例子？ – forethought

我有這個數據 - {「name」：「Jon」，「rollno」：123，「subjects」：[{「id1」：「Maths」，「id2」：「Hindi」}]}，{「名「：」羅恩」，「rollno」：234，「主題」：[{ 「ID1」：「英語」，「ID2」：「印地文」}]}。現在我想添加一個使用Name作爲Sharon，RollNo爲345，Id1爲歷史記錄的行。但是，由於Id1和Id2處於子級別，因此無法將它們插入到我的表格中。 – user3719049

您沒有顯示調用addData函數的位置，並且未使用「數據」。但是，如果你想插入'主題'，你可以做一些像var newSubjects = [{id1：'History'，'id1'：'English'}]; $ scope.myData.push（{name：'newData'，rollno：'newRollno'，subjects：newSubjects}）; – user1111

如果你試圖插入對象以及使用addData功能，您可以做以下。在HTML中添加這些NG-車型

<input ng-model="name" type="text"> 
    <input ng-model="rollno" type="number"> 
    <input ng-model="id" type="text"> 
    <input ng-model="subid1" type="text"/> 
    <input ng-model="subid2" type="text"/>

在JS

  $scope.addData = function(data){ 
     var arrData = {name:$scope.name,rollno:$scope.rollno,subjects:[{id1:$scope.subid1,id2:$scope.subid2 }]}; 
     $scope.myData.push(arrData); 
    }

來源

2016-09-25 13:23:54

謝謝蘭吉斯，這與魅力合作！ – user3719049

我還有一個問題。有這個jsfiddle - http://fiddle.jshell.net/jonhartmann/xd7e5eha/。如何使用表單向其添加動態子項目？假設我有一個帶有的按鈕，並且在js上有「name：$ scope.name」代替「name：'Child'+ count」。我想要用戶輸入孩子的名字。 – user3719049

您可以在表單中使用ng-submit來提交它 –

Angularjs - 無法動態推動兒童項目

回答

相關問題