7 votes

Formes angulaires avec ng-switch

J'essaie d'obtenir un objet de formulaire à partir de la portée d'un contrôleur lorsque je reçois un nom de formulaire. Cela fonctionne bien, mais si je crée le formulaire avec un ng-switch, le formulaire n'apparaît jamais dans le scope.

la vue

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

le contrôleur

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

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

Si je retire le ng-switch, je peux voir la propriété "theForm" du $scope comme l'objet du formulaire.

Une idée sur la manière de le faire. Je ne veux pas avoir les deux formulaires avec des noms différents et utiliser ng-show.

Voici l'exemple "qui ne fonctionne pas". http://plnkr.co/edit/CnfLb6?p=preview

9voto

Brandon Tilley Points 49142

Cela s'explique par le fait que ngSwitch crée une nouvelle portée. (Si vous regardez le $$childHead de la portée qui obtient console.log 'd, vous pouvez voir theForm à l'intérieur. C'est le ngSwitch ).

Si le formulaire portera toujours le même nom, vous pouvez simplement mettre la balise ngSwitch es à l'intérieur du formulaire :

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

Prograide.com

Prograide est une communauté de développeurs qui cherche à élargir la connaissance de la programmation au-delà de l'anglais.
Pour cela nous avons les plus grands doutes résolus en français et vous pouvez aussi poser vos propres questions ou résoudre celles des autres.

Powered by:

X