Question

所以我对angularjs相当新，并且在提交我的表格时遇到了一些问题，其内部有一个ng-repeat。我的问题是，在提交表单后，我获得的唯一值来自最后一行。我希望对象包含所有值的数组。

我的表格（抱怨它之后很烦乱）

    <form class="form-inline" role="form" name="addEventsForm">
            <div class="form-group col-xs-12" ng-repeat="item in Team.games">
                <div class="input-group col-xs-2" >
                    <input type="text" class="form-control" ng-model="item.date" name="date" datepicker-popup="{{format}}" is-open="$parent.opened[$index]" min-date="minDate"  datepicker-options="dateOptions"  ng-required="true" close-text="Close" />
                    <span class="input-group-btn">
                        <button type="button" class="btn btn-default" ng-click="open($event, $index)"><i class="glyphicon glyphicon-calendar"></i></button>
                    </span>
                </div>
                <div class="form-group col-xs-1" ng-class="{ 'has-error' : addEventsForm.time.$invalid && !addEventsForm.time.$pristine }">
                    <input type="text" class="form-control timepicker" ng-model="item.time" name="time" ng-blur="edit()"/>
                    <p ng-show="addEventsForm.time.$invalid && !addEventsForm.time.$pristine" class="help-block">Time is required.</p>
                </div>
                <div class="form-group col-xs-3" ng-class="{ 'has-error' : addEventsForm.title.$invalid && !addEventsForm.title.$pristine }">
                    <input type="text" class="form-control" name="title" ng-model="item.title" ng-blur="edit()" value="{{ item.awayTeam }} at {{ item.homeTeam }}" ng-minlength="1" ng-requred="true"/>
                    <p ng-show="addEventsForm.title.$invalid && !addEventsForm.title.$pristine" class="help-block">Title is required.</p>
                </div>
                <div class="form-group col-xs-2" ng-class="{ 'has-error' : addEventsForm.description.$invalid && !addEventsForm.discription.$pristine }">
                    <input type="text" class="form-control" name="description" ng-model="item.description" ng-blur="edit()" value="{{ item.venue }}" ng-maxlength="50" />
                </div>
                <div class="form-group col-xs-3" >
                    <input type="text" class="form-control geoLocation" name="location" ng-model="item.location" placeholder="Enter a location">
                </div>
                <div class="form-group col-xs-1">
                    <button type="button" class="btn btn-danger" ng-click="remove(Team.games, $index)">Remove</button>
                </div>
            </div>
        </form>
        <div class="form-actions pull-right">
            <button class="btn btn-primary btn-large" ng-click="submit(addEventsForm)" data-loading-text="Importing...">
                <span class="icon icon-plus-fill" ></span>
                Import Events
            </button>
        </div>
    </div>

我的js文件中没有代码只是我用来查看通过

传递的值的函数

Answer 1

这种情况正在发生，因为您具有相同的name属性，所有重复都会出现。如果您希望它们作为数组，您可以将$index添加到您的name属性中。 $ index是你在循环中完成的迭代次数（参见docs）。

因此，最后，您的表单将生成一个包含每次迭代的子对象的数组。

您无法简单地将$ index放在您的name属性前面。我不知道该怎么做但可能使用ng-attr并且玩游戏可以解决你的问题。

使用ng-repeat项目在Angularjs中提交表单

1 个答案: