Kątowe formy z przełącznikiem ng

Próbuję uzyskać obiekt formularza z zakresu kontrolera, gdy otrzymam nazwę do formularza. Działa dobrze, ale jeśli utworzę formularz za pomocą przełącznika ng, formularz nigdy nie pojawi się w zakresie.Kątowe formy z przełącznikiem ng

widok

<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>

kontroler

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

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

Jeśli usunąć NG-przełącznik widzę właściwość "theForm" z zakresu $ jako obj formularza.

Każdy pomysł, jak to zrobić. Nie chcę mieć dwóch formularzy o różnych nazwach i używać programu ng-show.

Oto przykład "nie-pracy" http://plnkr.co/edit/CnfLb6?p=preview

Źródło

2013-05-03 blackjid

thx. spędziłem godzinę na tym. Objawem, który dostałem, było to, że $ valid i $ dirty stało się dla mnie niedostępne. – ErichBSchulz

To dlatego ngSwitch tworzy nowy zakres. (Jeśli spojrzysz na wartość zakresu $$childHead, otrzymasz console.log 'd, możesz zobaczyć w nim theForm. To jest zasięg ngSwitch).

Jeżeli formularz będzie zawsze taka sama nazwa, można po prostu umieścić ngSwitch es wewnątrz postaci:

<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>

Źródło

2013-05-03 21:34:15

Dzięki, dowiedziałem się o wiele więcej niż oczekiwałem z twoją odpowiedzią. – blackjid

Zamiast używać 'ng-switch on' jako atrybutu, możemy użyć go jako oddzielnego znacznika, aby uczynić go bardziej czytelnym. Przykład: ' ...' – Abilash

@Abilash Prawda, ale jeśli zależy Ci na IE 8 i poniżej, upewnij się, że używasz 'document.createElement' zgodnie z [Internet Explorer Przewodnik kompatybilności] (http://docs.angularjs.org/guide/ie) –

Odpowiedz

Powiązane problemy