如何使用 ng-click 将元素添加到表单中？

Question

我有一个包含 4 个字段的表单

<form name="form">
    Name:
    <input type="text" ng-model="edit.name"><br />
     age:
    <input type="text" ng-model="edit.age"><br />
     phone:
    <input type="text" ng-model="edit.phone"><br />
     address:
    <input type="text" ng-model="edit.address"><br />

  </form>

我在 app.js 中有一个数组

 $scope.statuses = [
    {value: 1, text: 'status1'},
    {value: 2, text: 'status2'},
    {value: 3, text: 'status3'},
    {value: 4, text: 'status4'}
  ]; 

我在 html 中重复该数组，我想要做的是当单击“编辑”等按钮时，我希望文本出现在表单中 PLUNKER

所以基本上正如您在 plunker 中看到的那样，当我单击编辑按钮时，我希望“status1”“status2”“status3”“status4”出现在“name”“age”形式的字段中“电话”和“地址”

Answer 1

您的问题有点不清楚，但我认为您想要做的是将 statuses 更改为表单值。 我为你创建了这个plunker

关于您的 ng-click 功能。我将 statuses 数组文本（在您的 html 中以 ng-repeat 显示）更改为您的表单 edit 值：

$scope.editFunction = function(edit){
   $scope.statuses[0].text=edit.name;
   $scope.statuses[1].text=edit.age;
   $scope.statuses[2].text=edit.phone;
   $scope.statuses[3].text=edit.address;
};

或者如果您希望您的数组值在您的表单中，只需反转您的函数中的 =，例如 plunker ： 但在这种情况下，如果你想让你的空表单工作，你应该在你的控制器中声明编辑。

$scope.edit=[];

$scope.editFunction = function(edit){
   edit.name=$scope.statuses[0].text;
   edit.age=$scope.statuses[1].text;
   edit.phone=$scope.statuses[2].text;
   edit.address=$scope.statuses[3].text;
};

所以您使用的是 ng-model。无需将参数传递给您的函数，您可以在 editFunction

中使用 $scope.edit 而不是传递参数