Tôi có thể truy cập một biểu mẫu trong bộ điều khiển không?

Tôi hiện đang sử dụng như sau.

$scope.$$childHead.customerForm[firstName], vậy nên:

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

Nhưng điều này chỉ hoạt động trong Chrome. Bây giờ tôi đã thử như sau:

$scope.editCustomerForm[firstName], vậy nên:

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

Mà không làm việc. Lưu ý biểu mẫu của tôi nằm trong Tab Foundation. Làm thế nào tôi có thể truy cập firstName?

EDIT : Có vẻ như formkhông được thêm vào scopekhi nó nằm trong Tab Foundation.

Bất cứ ai cũng có một giải pháp cho điều này?

Mặc dù được nhắc đến trong các bình luận khác, tôi nghĩ tôi sẽ đánh vần nó một chút cho những người sử dụng cú pháp "Trình điều khiển dưới dạng":

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

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

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

</div>

Sau đó, bạn có thể truy cập FormContoder trong mã của mình như:

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

    function saveChanges() {

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

Bạn có thể đính kèm biểu mẫu vào một số đối tượng được xác định trong bộ điều khiển chính. Sau đó, bạn có thể đạt được hình thức của bạn ngay cả từ một phạm vi con.

Bộ điều khiển phụ huynh

$scope.forms = {};

Một số mẫu trong phạm vi con

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

Vấn đề là hình thức không phải được xác định trong thời điểm mã trong bộ điều khiển được thực thi. Vì vậy, bạn phải làm một cái gì đó như thế này

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

Nếu bạn muốn truyền biểu mẫu cho bộ điều khiển cho mục đích xác thực, bạn có thể chỉ cần chuyển nó dưới dạng đối số cho phương thức xử lý việc gửi. Sử dụng tên biểu mẫu, vì vậy đối với câu hỏi ban đầu, nó sẽ giống như:

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

Bit muộn cho một câu trả lời nhưng đi kèm với tùy chọn sau. Nó đang làm việc cho tôi nhưng không chắc nó có đúng cách hay không.

Theo quan điểm của tôi, tôi đang làm điều này:

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

Và trong bộ điều khiển:

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

Bây giờ sau khi làm điều này, tôi đã có biểu mẫu của mình trong biến điều khiển $scope.myForm

Để có thể truy cập biểu mẫu trong bộ điều khiển của bạn, bạn phải thêm nó vào một đối tượng phạm vi giả.

Cái gì đó như $scope.dummy = {}

Đối với tình huống của bạn, điều này có nghĩa là:

<form name="dummy.customerForm">

Trong bộ điều khiển của bạn, bạn sẽ có thể truy cập biểu mẫu bằng cách:

$scope.dummy.customerForm

và bạn sẽ có thể làm những thứ như

$scope.dummy.customerForm.$setPristine()

LIÊN KẾT WIKI

Có một '.' trong các mô hình của bạn sẽ đảm bảo rằng kế thừa nguyên mẫu đang hoạt động. Vì vậy, sử dụng <input type="text" ng-model="someObj.prop1">chứ không phải là<input type="text" ng-model="prop1">

Nếu bạn thực sự muốn / cần sử dụng một nguyên thủy, có hai cách giải quyết:

1.Sử dụng $ Parent.parentScopeProperty trong phạm vi con. Điều này sẽ ngăn phạm vi con tạo tài sản riêng của nó. 2. Xác định một hàm trên phạm vi cha và gọi nó từ con, truyền giá trị nguyên thủy lên tới cha mẹ (không phải lúc nào cũng có thể)

Câu trả lời này hơi muộn, nhưng tôi tình cờ tìm ra giải pháp giúp mọi thứ trở nên dễ dàng hơn rất nhiều.

Bạn thực sự có thể gán tên biểu mẫu trực tiếp cho bộ điều khiển của mình nếu bạn đang sử dụng cú pháp của bộ điều khiển và sau đó tham chiếu nó từ biến "này". Đây là cách tôi đã làm nó trong mã của mình:

Tôi đã cấu hình bộ điều khiển thông qua ui-router (nhưng bạn có thể làm điều đó theo cách bạn muốn, ngay cả trong HTML trực tiếp với một cái gì đó giống như <div ng-controller="someController as myCtrl">) Đây là giao diện của cấu hình ui-router:

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

và sau đó trong HTML, bạn chỉ cần đặt tên biểu mẫu là "tên bộ điều khiển". "tên" như vậy:

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

Bây giờ trong bộ điều khiển của bạn, bạn có thể chỉ cần làm điều này:

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

Có, bạn có thể truy cập một biểu mẫu trong bộ điều khiển (như đã nêu trong tài liệu ).

Ngoại trừ khi biểu mẫu của bạn không được xác định trong phạm vi điều khiển và được xác định trong phạm vi con thay thế.

Về cơ bản, một số chỉ thị góc, chẳng hạn như ng-if, ng-repeathoặc ng-include, sẽ tạo ra một phạm vi con bị cô lập. Vì vậy, bất kỳ chỉ thị tùy chỉnh với một scope: {}tài sản được xác định. Có lẽ, các thành phần nền tảng của bạn cũng theo cách của bạn.

Tôi đã có cùng một vấn đề khi giới thiệu một đơn giản ng-ifxung quanh <form>thẻ.

Xem những điều này để biết thêm:

• https://groups.google.com/forum/#!topic/angular/B2uB8-9_Xbk

• AngularJS - mất phạm vi khi sử dụng ng-gộp

Lưu ý: Tôi đề nghị bạn viết lại câu hỏi của bạn. Câu trả lời cho câu hỏi của bạn là có nhưng vấn đề của bạn hơi khác:

Tôi có thể truy cập một biểu mẫu trong phạm vi con từ bộ điều khiển không?

Câu trả lời đơn giản là: không .

thêm ng-model="$ctrl.formName"thuộc tính vào biểu mẫu của bạn và sau đó trong trình điều khiển, bạn có thể truy cập biểu mẫu dưới dạng một đối tượng bên trong trình điều khiển của mình bằng cáchthis.formName

Chắc chắn bạn không thể truy cập mẫu trong phạm vi bec. nó không được tạo ra DOM từ mẫu html được tải chậm một chút như trình xây dựng bộ điều khiển. giải pháp là xem cho đến khi DOM được tải và tất cả phạm vi được xác định!

trong bộ điều khiển:

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