Question

我有以下代码：

<form ng-submit="addRow($index)">
    <input type="text" ng-repeat="column in table.columns" ng-model="column">
    <input type="submit" value="add row">
</form>

现场代码：

http://jsfiddle.net/muehvxx1/

我要做的是，无论何时单击“添加行”按钮，都会向范围（到表单的父对象）添加一个新对象，传递表单字段中的所有值。

到目前为止，您可以将对象添加到正确的父对象（可以正常工作），但它不会传递字段的值。

Answer 1

你可以做这样的事情http://jsfiddle.net/9g8vpnaa/

HTML：表单

<form ng-submit="addRow(table)">
  <input type="text" ng-repeat="column in table.columns" ng-model="table.newItem[column]">
  <input type="submit" value="add row">
</form>

JS：addRow（）

$scope.addRow = function(table){
  table.items.push(table.newItem);
  table.newItem = {};
};

Answer 2

我添加了什么，并为所有表添加了另外的对象newRow

    $scope.tables = [
        {name: 'tweets',
        columns: ['id', 'message', 'user'],
        items: [
            {id: 1, message: 'hello', user: 'mike'},
            {id: 2, message: 'hi', user: 'bob'},
            {id: 3, message: 'whatup', user: 'bob'}
        ],
         newRow :{}
        },
        {name: 'users',
        columns: ['id', 'username'],
        items: [
            {id: 1, username: 'mike'},
            {id: 2, username: 'bob'}
        ],
         newRow :{}
        }
    ];

然后我使用该对象绑定到输入

<form ng-submit="addRow(table)">
    <input type="text" ng-repeat="column in table.columns" ng-model="table.newRow[column]" />
    <input type="submit" value="add row" />
</form>

然后，当用户单击“添加行”

时，您只需将该对象添加到项目中

    $scope.addRow = function(table){
        console.log($scope.id);
        table.items.push(table.newRow);
    };

JSFiddle

Angular - 如何将ng-model从ng-repeat传递到函数和范围

2 个答案: