Question

我目前正在使用以下内容。

$scope.$$childHead.customerForm[firstName]，所以：

<form name="customerForm">
  <input type="text" name="firstName" 
         ng-model="data.customer.firstName" 
         tabindex="1"  
         ng-disabled="!data.editable" 
         validationcustomer />
</form>

但这仅适用于Chrome。现在我尝试了以下内容：

$scope.editCustomerForm[firstName]，所以：

<form name="customerForm" ng-model="editCustomerForm">
  <input type="text" name="firstName" 
         ng-model="data.customer.firstName" tabindex="1"  
         ng-disabled="!data.editable" 
         validationcustomer />
</form>

哪个不起作用。请注意，我的表单位于Foundation选项卡中。我如何访问firstName？

编辑：当form位于基金会标签内时，scope似乎没有添加到{{1}}。

任何人都有解决方案吗？

Answer 1

虽然在其他评论中提到过，但我认为我会为那些使用＆＃34; Controller As＆＃34;语法：

<div ng-controller="MyController as ctrl">

<form name="ctrl.myForm">
    ...inputs
    Dirty? {{ctrl.myForm.$dirty}}

    <button ng-click="ctrl.saveChanges()">Save</button>
</form>

</div>

然后您可以在代码中访问FormController，如：

function MyController () {
    var vm = this;
    vm.saveChanges = saveChanges;

    function saveChanges() {

       if(vm.myForm.$valid) { 
            // Save to db or whatever.
            vm.myForm.$setPristine();
       }
}

Answer 2

您可以将表单附加到父控制器中定义的某个对象。然后你甚至可以从儿童范围到达你的表格。

家长控制器

$scope.forms = {};

子范围内的某些模板

<form name="forms.form1">
</form>

问题是，在执行控制器中的代码时，不必定义表单。所以你必须做这样的事情

$scope.$watch('forms.form1', function(form) {
  if(form) {
    // your code...
  }
});

Answer 3

如果要将表单传递给控制器以进行验证，可以将其作为参数传递给处理提交的方法。使用表单名称，因此对于原始问题，它将类似于：

<button ng-click="submit(customerForm)">Save</button>

Answer 4

回答迟到了，但附带以下选项。它对我有用，但不确定它是否正确。

在我看来，我这样做：

<form name="formName">
    <div ng-init="setForm(formName);"></div>
</form>

在控制器中：

$scope.setForm = function (form) {
    $scope.myForm = form;
}

现在执行此操作后，我的控制器变量中的表单为$scope.myForm

Answer 5

为了能够访问控制器中的表单，您必须将其添加到虚拟范围对象。

像$scope.dummy = {}

这样的东西

对于你的情况，这意味着：

<form name="dummy.customerForm">

在您的控制器中，您可以通过以下方式访问该表单：

$scope.dummy.customerForm

你可以做像

这样的事情

$scope.dummy.customerForm.$setPristine()

WIKI LINK

有一个＆＃39;。＆＃39;在你的模型中将确保原型继承   在游戏中。所以，请使用<input type="text" ng-model="someObj.prop1">   比<input type="text" ng-model="prop1">

如果您确实需要/需要使用原语，则有两种解决方法：

1.在子范围内使用$ parent.parentScopeProperty。这会阻止   子范围来自创建自己的属性。 2.定义一个函数   父范围，并从子系统调用它，传递原语   价值高于父母（并非总是可能）

Answer 6

这个答案有点晚了，但我偶然发现了一个让一切变得简单的解决方案。

如果您使用的是controllerAs语法，则可以直接将表单名称直接分配给控制器，然后从“this”变量引用它。以下是我在代码中的使用方法：

我通过ui-router配置了控制器（但你可以随心所欲地做到这一点，即使在HTML中直接使用像<div ng-controller="someController as myCtrl">这样的东西）这就是ui-router配置中的样子： / p>

views: {
            "": {
                templateUrl: "someTemplate.html",
                controller: "someController",
                controllerAs: "myCtrl"
            }
       }

然后在HTML中，您只需将表单名称设置为“controllerAs”。“name”就像这样：

<ng-form name="myCtrl.someForm">
    <!-- example form code here -->
    <input name="firstName" ng-model="myCtrl.user.firstName" required>
</ng-form>

现在在您的控制器中，您可以非常简单地执行此操作：

angular
.module("something")
.controller("someController",
    [
       "$scope",
        function ($scope) {
            var vm = this;
            if(vm.someForm.$valid){
              // do something
            }
    }]);

Answer 7

是的，您可以访问控制器中的表单（如docs中所述）。

除非您的表单在控制器范围内定义为不，而是在子范围内定义。

基本上，某些角度指令（例如ng-if，ng-repeat或ng-include）将创建一个独立的子范围。所有定义了scope: {}属性的自定义指令也是如此。可能你的基础组件也在你的方式。

在ng-if标记周围引入简单的<form>时遇到了同样的问题。

有关详细信息，请参阅以下内容：

注意：我建议你重新写一下你的问题。您的问题的答案是是，但您的问题略有不同：

我可以从控制器访问子范围内的表单吗？

答案只是：否。

Answer 8

将ng-model="$ctrl.formName"属性添加到您的表单，然后在控制器中，您可以通过this.formName

在控制器中访问该表单作为对象

Answer 9

绝对不能访问范围内的表格。它没有被创建。来自html模板的DOM像控制器构造函数一样缓慢加载。解决方案是观察，直到加载DOM并定义所有范围！

控制器中的

：

$timeout(function(){
    console.log('customerForm:', $scope.customerForm);
    // everything else what you need
});

我可以访问控制器中的表单吗？

9 个答案: