Question

我有一个表单页面，其中包含多个输入字段，并且在表单顶部有一个下拉字段。
条件是当下拉值更改时，某些字段的位置也会更改。.
例如：
下拉菜单中的值为1。

Name ____  
Address ____  
PAN No ____  
Mobile ____

并具有下拉列表2的形式。

Name ____  
Mobile ____   
Location ____  
PAN No ____

链接plnkr

Answer 1

您可以尝试与此类似的方法。

声明要显示的字段array，首先将其array保留为空，然后根据change在value的下拉列表中填充array所需的字段，将您的UI绑定到该动态array。

类似：-

$scope.inMod = ["Noda1", "Noda2" ];
$scope.stack = []; //initially the stack has no items, empty UI
$scope.selectedNoda = ''; //this makes sure nothing show up
$scope.nodaChange = function(value){
    if(value=='Noda1') {
         $scope.stack = ['Name', 'Address', 'PAN No', 'Mobile'];
    }
    if(value=='Noda2') {
          $scope.stack = ['Name', 'Mobile', 'Location', 'PAN No'];
    }
}

并迭代array中的UI

<select ng-model="selectedNoda" ng-change="nodaChange(selectedNoda)" ng-options="x for x in inMod">
</select>
<div ng-repeat="item in stack">
  <label>{{item}}:</label>
  <input id="item" type="text" ng-model="item" />
  <br /> 
</div>

更改div位置运行时间

1 个答案: