Geek Answers Handbook

Angular forms with ng switch

I am trying to get a form object from the controller scope when I get a name for the form. It works fine, but if I create the form using the ng switch, the form never shows up in the area.

view

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

controller

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

If I remove ng-switch, I can see the "theForm" property from $ scope as a form of obj.

Any idea how to do this. I do not want to have two forms with different names and use ng-show.

Here is an example of "idle" http://plnkr.co/edit/CnfLb6?p=preview

+7
source share
1 answer

This is because ngSwitch creates a new scope. (If you look at the value $$childHead area that console.log 'd gets, you can see theForm inside it. This is the ngSwitch area).

If the form will always be the same name, you can simply put ngSwitch es inside the form:

 <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>
+9
source

More articles:


All Articles