2013-05-03 27 views
7

Tôi đang cố gắng lấy đối tượng biểu mẫu từ phạm vi của bộ điều khiển khi tôi nhận được tên để tạo biểu mẫu. Nó hoạt động tốt, nhưng nếu tôi tạo biểu mẫu bằng ng-switch, biểu mẫu không bao giờ hiển thị trong phạm vi.Các hình thức góc với ng-switch

quan điểm

<body ng-controller="MainCtrl"> 

    <div ng-switch on="type"> 
     <form name="theForm" ng-switch-when="1"> 
     <label>Form 1</label> 
     <input type="text"/> 
     </form> 
     <form name="theForm" ng-switch-when="2"> 
     <label>Form 2</label> 
     <input type="text"/> 
     <input type="text"/> 
     </form> 

    </div> 

    <button ng-click="showScope()">Show scope</button> 
</body> 

bộ điều khiển

app.controller('MainCtrl', function($scope) { 
    $scope.type = 1; 

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

Nếu tôi loại bỏ các ng-switch tôi có thể thấy tài sản "theForm" từ $ phạm vi là hình thức obj.

Bất kỳ ý tưởng nào về cách thực hiện. Tôi không muốn có hai hình thức với tên gọi khác nhau và sử dụng ng-show.

Dưới đây là ví dụ "không làm việc" http://plnkr.co/edit/CnfLb6?p=preview

+0

thx. dành một giờ cho việc này. các triệu chứng tôi nhận được là $ $ và $ bẩn đã trở thành không có sẵn cho tôi. – ErichBSchulz

Trả lời

9

Điều này là do ngSwitch tạo ra phạm vi mới. (Nếu bạn nhìn vào giá trị $$childHead của phạm vi có được là console.log 'd, bạn có thể thấy theForm bên trong nó. Đây là phạm vi ngSwitch).

Nếu hình thức sẽ luôn luôn là cùng tên, bạn chỉ có thể đặt ngSwitch es bên trong các hình thức:

<form name="theForm"> 
    <div ng-switch on="type"> 
    <div ng-switch-when="1"> 
     <label>Form 1</label> 
     <input type="text"/> 
    </div> 
    <div ng-switch-when="2"> 
     <label>Form 2</label> 
     <input type="text"/> 
    </div> 
    </div> 
</form> 
+0

Cảm ơn, tôi đã học được nhiều hơn tôi mong đợi với câu trả lời của bạn. – blackjid

+1

Thay vì sử dụng 'ng-switch on' làm thuộc tính, chúng ta có thể sử dụng nó như một thẻ riêng biệt để dễ đọc hơn. Ví dụ: ' ...' – Abilash

+1

@Abilash Đúng, nhưng nếu bạn quan tâm đến IE 8 trở xuống, hãy đảm bảo sử dụng 'document.createElement' theo [Internet Explorer] Hướng dẫn tương thích] (http://docs.angularjs.org/guide/ie) –

Các vấn đề liên quan