无法在angularjs中找到动态创建的字段的范围

Question

我正在尝试创建一种表单，用户可以在其中通过按下按钮来动态添加输入字段。 但我无法获取该输入字段的值给控制器？ 以下是我的表格：

<div ng-repeat="skill in skill_set">
    <label>Skill-name</label>
    <input type="text"name="" ng-model="skill.sName" placeholder="enter your skills here">
    <button class="remove" ng-show="$last" ng-click="removeSkill()">-</button>
</div>
    <button type="button" ng-click="addNewSkill()">Add more Skills</button>
    <a ui-sref="/"  ng-click="createMeetup()"> Next Section </a>

我的控制器定义如下：

var app = angular.module('meetupApp', ['ngResource','ui.router']);
app.controller('mainCrl', ['$scope', '$resource', '$location', function ($scope, $resource, $location) {
  $scope.skill_set = [{id: 'skill1'}];

  $scope.addNewSkill = function() {
    var newItemNo = $scope.skill_set.length+1;
    $scope.skill_set.push({'id':'skill'+newItemNo});
    };

  $scope.removeSkill = function() {
    var lastItem = $scope.skill_set.length-1;
    $scope.skill_set.splice(lastItem);
    };

  $scope.createMeetup = function () {
    var employee = new Employee();
    console.log("the skill set is"+ $scope.skill_set.sName);
    employee.skills =[{skill_name: $scope.skill_set.sName}] ;
    employee.$save();
    };
}]);

员工是mongodb文档，其中技能是skill_name的数组。 当我安慰技能时。 它向我显示“技能集未定义”，如何从输入字段到控制器获取值？ 小小的帮助真的很感激！！！

Answer 1

您正在迭代中填充sName。 因此，如果您不想获取技能名称，则代码应类似于$scope.skill_set[iteration].sName

如果您不需要技能名称数组，请在skill_set上循环以创建适当的数组。

---

但是使用ng-model="skill.skill_name"操作$ scope会更容易

并分配employee.skills = $scope.skill_set;

您确实在模型中添加了一个ID，以保持其清洁，必须避免使用Id属性，因此请添加新项： $scope.skill_set.push({'skill_name':''+});

$scope.skill_set应该看起来像

[
      {'skill_name' : "skillname1"},
      {'skill_name' : "skillname2"},
      {'skill_name' : "skillname3"}
]

或者，如果您只需要技能名称的数组

var skillNames = [];
for (skill in $scope.skill_set)
{
    skillNames.push(skill.skill_Name);
}
 employee.skills = {'skill_name' : skillNames};

employee.skills技能看起来像

{ 'skill_name' : [ "skillname1", "skillname2", "skillname3" ]}

---

V2：代码干净

但是使用ng-model="skill"操作$ scope会更容易

并分配employee.skills = {'skill_name' : $scope.skill_set};

您确实在模型中添加了一个ID，以保持其清洁，必须避免使用Id属性，因此请添加新项： $scope.skill_set.push({''});

employee.skills技能看起来像

{ 'skill_name' : [ "skillname1", "skillname2", "skillname3" ]}

---

我保留第一个解决方案，因为我不确定您需要哪种数据格式。