使用ng-switch的Angular表单



我试图从控制器的范围获得一个表单对象,当我得到一个名称来变形。它工作得很好,但如果我用ng开关创建表单,表单永远不会显示在作用域中。

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

控制器

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

如果我删除ng开关,我可以看到属性"theForm"从$作用域作为表单obj。

知道怎么做吗?我不希望这两个表单有不同的名称,并使用ng-show。

下面是"not-working"的例子http://plnkr.co/edit/CnfLb6?p=preview

这是因为ngSwitch创建了新的作用域。(如果你看得到console.log 'd的scope的$$childHead值,你可以看到theForm在里面。这是ngSwitch范围)。

如果表单总是相同的名称,您可以简单地将 ngSwitches放入表单中:

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

相关内容

  • 没有找到相关文章

最新更新