2013-05-03 18 views
7

Sto cercando di ottenere un oggetto modulo dall'ambito di un controller quando ottengo un nome per de form. Funziona bene, ma se creo il modulo con un ng-switch, il modulo non viene mai mostrato nell'ambito.Moduli angolari con ng-switch

la vista

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

il controller

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

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

Se rimuovo il ng-switch che posso vedere la proprietà "theForm" dal $ portata come la forma obj.

Qualche idea su come farlo. Non voglio avere le due forme con nomi diversi e usare ng-show.

Ecco l'esempio "non-funziona" http://plnkr.co/edit/CnfLb6?p=preview

+0

thx. ho passato un'ora su questo. il sintomo che ho ottenuto è stato che $ valido e $ sporco non sono stati disponibili per me. – ErichBSchulz

risposta

9

Questo perché ngSwitch crea nuovo ambito. (Se si guarda il valore $$childHead dell'ambito che ottiene è console.log 'd, è possibile vedere theForm all'interno di esso. Questo è lo scope ngSwitch).

Se il modulo sarà sempre lo stesso nome, si può semplicemente mettere le ngSwitch es all'interno del modulo:

<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

Grazie, ho imparato molto più di quanto mi aspettassi con la tua risposta. – blackjid

+1

Invece di usare 'ng-switch on' come attributo, possiamo usarlo come tag separato per renderlo più leggibile. Es: ' ...' – Abilash

+1

@Abilash Vero, ma se ti interessa di IE 8 e di seguito, assicurati di usare 'document.createElement' come per [Internet Explorer Guida alla compatibilità] (http://docs.angularjs.org/guide/ie) –