Question

最初我是angular.i的新手。我正在提交一个简单的表单提交，其中许多输入字段将来自一个对象。我的问题是我无法收集修改后的表单数据json on button ng-点击。

<form id="fmsubmit" role="form">
   <div class="form-group" ng-repeat="(key, value) in showCase.person">
     <label for="{{key}}">{{key}}</label>
     <input type="text" ng-disabled="key=='rowId'" class="form-control"  id="{{key}}" placeholder="{{key}}" name="{{key}}" value={{value}} ng-modal="row[value]"/>
   </div>
 <button type="submit" ng-click="showCase.submitData(row)" class="btn btn-default">Submit</button>
</form>

我的控制器

$scope.submitData = function(person){
  console.log(person);
}

Answer 1

两件事：ng-model中的错字，行未定义。
说实话，我并不完全确定你想做什么。我假设您要基于对象结构生成表单，并在表单更改后获取更新对象。如果你想要我被描述的场景，那么你可以在这里小提琴：fiddle

<form id="fmsubmit" role="form">
        <div class="form-group" ng-repeat="(key, value) in showCase.person">
            <label for="{{key}}">{{key}}</label>
            <input type="text" class="form-control" id="{{key}}" ng-disabled="key=='rowId'" placeholder="{{key}}" name="{{key}}" ng-model="showCase.person[key]" />
        </div>
        <button type="submit" ng-click="showCase.submitData(showCase.person)" class="btn btn-default">Submit</button>
    </form>

function TestCtrl($scope) {
$scope.showCase = {};
$scope.showCase.person = {
    "id": 2,
        "project": "wewe2012",
        "date": "2013-02-26",
        "description": "ewew",
        "eet_no": "ewew",
};
$scope.showCase.submitData = function (person) {
    console.log(person);
    alert(JSON.stringify(person));
};
}

编辑：
如果您想要一个新的变量“row”负责存储人员数据，那么可以在此处获得示例：fiddle - use additonal row variable to store person data

<form id="fmsubmit" role="form" ng-init="row={}">
        <div class="form-group" ng-repeat="(key, value) in showCase.person" ng-init="row[key]=value">
            <label for="{{key}}">{{key}}</label>
            <input type="text" class="form-control" id="{{key}}" ng-disabled="key=='rowId'" placeholder="{{key}}" name="{{key}}" ng-model="row[key]" />
        </div>
        <button type="submit" ng-click="showCase.submitData(row)" class="btn btn-default">Submit</button>
    </form>

function TestCtrl($scope) {
$scope.showCase = {};
$scope.showCase.person = {
    "id": 2,
        "project": "wewe2012",
        "date": "2013-02-26",
        "description": "ewew",
        "eet_no": "ewew",
};
$scope.showCase.submitData = function (person) {
    console.log(person);
    alert(JSON.stringify(person));
};
}

Answer 2

我认为这行未定义。并且它不适用于范围。你必须使用$ scope。$ apply（）。还有为什么要使用动态ng模型？使用角度静态方法和模型，您可以管理任何类型的表单。并尝试一些指令。 http://projectslanka.blogspot.com/search/label/AngularJS

使用动态ng-modal数据提交角度表单

2 个答案: