在AngularJS

时间:2017-06-26 07:50:56

标签: angularjs html-table

由于以下代码,我设法动态添加一列的行,但我希望这些行有多个列,其中一列允许用户输入要存储的注释。这是具有单列的代码:

  <div ng-controller="MainController">
    <script type="text/javascript">
        app.controller('MainController', function($scope) {
        $scope.rows = [];
        $scope.counter = 0;
        $scope.$on("CallParentMethod", function(event, args) {
          $scope.addRow(args);
        });
        $scope.addRow = function(args) {
          $scope.rows.push($scope.counter + ": bottone:" + args.button + ': cambio in ' + args.value);
          $scope.counter++;
          }
       });
    </script>
    <table>
        <thead>
            <tr>
                <th width="200">Logs</th>
            </tr>
        </thead>
        <tbody>
            <tr ng-repeat="rowContent in rows">
                <td>{{rowContent}}</td>
            </tr>
        </tbody>
    </table>
</div>

1 个答案:

答案 0 :(得分:0)

基本上你必须重复行和列,你的数据必须是一个数组数组。像这样:

<div ng-controller="MainController">
<script type="text/javascript">
app.controller('MainController', 
    function ($scope) {
        $scope.rows = [];
        $scope.counter = 0;
        $scope.$on("CallParentMethod", function(event, args){
            $scope.addRow(args);
        });
        $scope.addRow = function(args) {
            $scope.rows.push([args.button, args.value]);
            $scope.counter++;
        }
    }
);

</script> 
<table>
  <thead>
    <tr>
      <th width="200">Logs</th>
    </tr>
  </thead>
  <tbody>
    <tr ng-repeat="rowContent in rows">
      <td ng-repeat="cellContent in rowContent">{{cellContent}}</td>
    </tr>
  </tbody>
</table> 
</div>