Question

我第一次尝试使用ng-include和ng-submit。我一直试图遵循这个问题Why form undefined inside ng-include when checking $pristine or $setDirty()?。以下是我构建index.html的方法：

<div id="info" ">
   <div ng-include src="'standard.html'" ng-controller="FormController as formcontrol"> 
</div>
</div>

在我的standard.html

中

<uib-accordion close-others="oneAtATime"> <uib-accordion-group
    heading="{{person.personID}}" ng-repeat="person in people.info">
<form name="formHolder.personForm>

    <div class ="form-group">
      <input type="text" name="name"
      class="form-control" 
      ng-model="person.name"
      ng-readonly="person.name">
    </div>

    ----------
  </form>
<button type="button" ng-submit="updateStatus(person.personID)"
    class="btn btn-success btn-lg btn-block">Update</button>

同样，我还有20个字段，其中只有4个是可编辑字段。一旦用户单击更新按钮，我想将所有表单数据转换为在FormController中进行的ajax调用。

在我的FormController中：

(function() {
    angular.module('peopleInfo2').controller('FormController', ['$http','$scope', function($http, $scope) {                 

        $scope.formHolder = {};
        $scope.updateStatus =function (personID) {
            console.log($scope.formHolder);
        };
    }]);        
})();

问题：

a）当我使用ng-submit时不会调用表单，但是当我使用ng-click时它会执行。我已经阅读了他们和他们说我应该使用ng-submit的所有地方之间的差异。我做错了什么？

b）目前，如果我使用ng-click，则$ scope.formHolder中的数据是一个personForm对象，它包含我的数据，所有这些对象都在updateStatus函数中。为什么我无法像deviceForm.personID那样访问它们？为什么它给了我$ modelValue和$ viewValue这样的值，而不仅仅是形式上绑定到ng-model的值？

c）如果我使用ng-click，那么每当提交表单时。它只是从person.info数组中的最后一个条目中获取值。这意味着无论如何，只有在尝试读取ng-model的值时才能访问ng-repeat读取的最后一个值。为什么呢？

我将不胜感激任何帮助。我接近得到这个东西，但我想确保我理解正确，因为它将在整个项目中使用。我之前尝试使用自定义指令，但有人建议这种方法不能正确呈现Web表单，应该使用ng-include。谢谢。

Answer 1

您的代码中存在一些问题，但作为第一个问题，我认为您应该在表单标记上使用ng-submit指令。像这样：

<form name="{{formHolder.personForm}}" ng-submit="updateStatus(person.personID)">...</form>

在表单中使用<input type="submit" class="btn btn-success btn-lg btn-block"/>提交按钮。

但为什么不在表单中使用ng-repeat并将整个数组传递给提交函数？

在ng-include和ng-submit中丢失的范围不会在ng-click执行时提交表单但没有表单

1 个答案: