title: How do I add a row dynamically using angular js in a table?
body: <p>How do I add a row dynamically using AngularJS in a table, which contains data from a get request?</p>
  
  <p>I have written a code as such:</p>
  
  <pre><code>&lt;table id="tableRow" class="table table-bordered tableRow"&gt;
      &lt;thead&gt;
          &lt;tr&gt;
              &lt;th&gt;&lt;/th&gt;
              &lt;th&gt;
                  &lt;label&gt;Make&lt;/label&gt;
              &lt;/th&gt;
              &lt;th&gt;
                  &lt;label&gt;Vin&lt;/label&gt;
              &lt;/th&gt;
              &lt;th&gt;
                  &lt;label&gt;Model&lt;/label&gt;
              &lt;/th&gt;
              &lt;th&gt;
                  &lt;label&gt;Parts&lt;/label&gt;
              &lt;/th&gt;
              &lt;th&gt;
                  &lt;label&gt;&lt;/label&gt;
              &lt;/th&gt;
              &lt;th&gt;
                  &lt;label&gt;&lt;/label&gt;
              &lt;/th&gt;
          &lt;/tr&gt;
       &lt;thead&gt;
     &lt;/table&gt;
  </code></pre>
  
  <p>now using angular js how can i add a row on click of a button or a get request in the same table...?</p>
  
  <p>i had written a script which did'nt work the script is as follows..</p>
  
  <pre><code>$scope.myGet = function() {
                  $http.get("http://172.17.133.82:8080/restproj/v1/dealer")
                      .then(function(response) {
                      $scope.addRow = response.data;
                      var tall = '';
                      tall += '&lt;tr&gt;'+
                          '&lt;td&gt;&lt;button class="btn btn-danger btn-remove" type="button"&gt;&lt;i class="glyphicon glyphicon-trash gs"&gt;&lt;/i&gt;&lt;/button&lt;/td&gt;' +
                          '&lt;td&gt;&lt;input type="text" class="form-control" id="makeid"  ng-model="addRow.make"&gt;&lt;/td&gt;' +  
                          '&lt;td&gt;&lt;input type="text" class="form-control" id="vinid" ng-model="addRow.vin"&gt;&lt;/td&gt;'+
                          '&lt;td&gt;&lt;input type="text" class="form-control" id="modalid" ng-model="addRow.model"&gt;&lt;/td&gt;' + 
                          '&lt;td ng-repeat="part in addRow.parts"&gt;&lt;input type="text" class="form-control" id="partsid" ng-model="addRow.name"&gt;&lt;input type="text" class="form-control" id="partsid" ng-model="addRow.desc"&gt;&lt;/td&gt;' + 
                          '&lt;/tr&gt;';
  
                      $('#tableROW').append(tall);                 
                  });
  </code></pre>
  
  <p>I get error such as : </p>
  
  <blockquote>
    <p>tabelform.html:320 Uncaught SyntaxError: Unexpected end of input</p>
    
    <p>angular.min1.5.9.js:6 Uncaught Error: [$injector:modulerr]
    <a href="http://errors.angularjs.org/1.5.9/" rel="nofollow noreferrer">http://errors.angularjs.org/1.5.9/</a>$injector/modulerr?p0=myApp&amp;p1=Error%3A%2…Ic%20(http%3A%2F%2F127.0.0.1%3A63139%2Fjs%2Fangular.min1.5.9.js%3A21%3A332)(…)</p>
  </blockquote>