Question

我正在尝试将动态行作为文本框添加到表中，使用angularjs添加但是我没有得到如何从文本框中获取数据并存储在数组中？

代码：

<div class="col-lg-12 form-group">
    <div class="col-lg-12 fade-in tada" style="padding-top:10px">
        <table ng-table="tableParams" class="display table table-striped table-bordered">
            <tr ng-repeat="cap in data">
                <td data-title="'Group'" sortable="group">
                    <input type="text" ng-model="group" />
                </td>
                <td data-title="'status'" sortable="Status">
                    <input type="text" ng-model="Status" />
                </td>
                <td data-title="'Type'" sortable="type">
                    <input type="text" ng-model="type" />
                </td>
                <td data-title="'Enable'" sortable="Enable">
                    <input type="text" ng-model="Enable" />
                </td>
                <td data-title="'Line Type'" sortable="LineType">
                    <input type="text" ng-model="LineType" />
                </td>
                <td data-title="'Description'" sortable="Dec">
                    <input type="text" ng-model="Dec" />
                </td>
            </tr>
        </table>
    </div>
    <div class="col-lg-12">
        <div class="pull-right" style="padding-right:10px">
            <input type="submit" ng-click="bulk.submitFileset('process')" class="btn btn-default" value="Save" />
        </div>
        <div class="pull-right">
            <input type="submit" ng-click="addFormField()" class="btn btn-default" value="Add" />
        </div>
    </div>
</div>

JS文件：

(function() {
    var app = angular.module('arcadminmodule', ['ngTable', 'ui-notification']);
    app.controller('ArcAdminController', ['$http', '$scope', '$filter', 'ngTableParams', 'Notification', function($http, $scope, $filter, ngTableParams, Notification) {
        $scope.data = [];
        $scope.addFormField = function() {
            $scope.data.push('')
            $scope.tableParams.reload();
        }
    }]);
})();

Answer 1

我认为你需要改变你的html，如下所示。

<强> HTML

<tr ng-repeat="cap in data">
    <td data-title="'Group'" sortable="group">
        <input type="text" ng-model="cap.group" />
    </td>
    <td data-title="'status'" sortable="Status">
        <input type="text" ng-model="cap.Status" />
    </td>
    <td data-title="'Type'" sortable="type">
        <input type="text" ng-model="cap.type" />
    </td>
    <td data-title="'Enable'" sortable="Enable">
        <input type="text" ng-model="cap.Enable" />
    </td>
    <td data-title="'Line Type'" sortable="LineType">
        <input type="text" ng-model="cap.LineType" />
    </td>
    <td data-title="'Description'" sortable="Dec">
        <input type="text" ng-model="cap.Dec" />
    </td>
</tr>

然后你的控制器功能会改变如下

<强>代码

$scope.addFormField = function() {
    $scope.data.push({})
    $scope.tableParams.reload();
};

如何使用angularjs将动态行作为文本框添加到表中

1 个答案: