根据条件angularjs显示视图输入字段

时间:2018-06-28 07:17:49

标签: angularjs

[{id: "1", name: "first_name"},
{id: "2", name: "last_name"},
{id: "3", name: "city"}]

<div ng-if="first_name"> <input type="text" name="first_name" ng-model="user.first_name"></div>
<div ng-if="last_name"><input type="text" name="last_name" ng-model="user.last_name"></div>
<div ng-if="city"><input type="text" name="city" ng-model="user.city"></div>

$scope.flag = false;
angular.forEach(response, function(value, key){
              $scope.valueName = value.name;
        if($scope.valueName == 'first_name') {
            $scope.flag = true;
        }else if($scope.valueName == 'last_name'){
            $scope.flag = true;
        }else if($scope.valueName == 'city'){
            $scope.flag = true;
        }else{
            $scope.flag = false;
        }   
          });

如何基于条件angularjs显示视图输入字段,

这不是正确的解决方案,因为必须在上面写太多代码,我们必须使用其他可以帮助读取视图格式和根据条件显示的内容,对此的任何帮助将非常感谢。

1 个答案:

答案 0 :(得分:0)

您可以在JSON对象上循环播放的解决方案之一,将您的条件直接包含在ng-if中:

<div ng-if="x.name == 'first_name'" ng-repeat="x in records" ng-repeat-start> <input type="text" name="first_name" ng-model="user.first_name"></div>
<div ng-if="x.name == 'last_name'"><input type="text" name="last_name" ng-model="user.last_name"></div>
<div ng-if="x.name == 'city'" ng-repeat-end><input type="text" name="city" ng-model="user.city" ></div>

没有ng-repeat-start

<div ng-repeat="x in records">
   <div ng-if="x.name == 'first_name'" > <input type="text" name="first_name" ng-model="user.first_name"></div>
    <div ng-if="x.name == 'last_name'"><input type="text" name="last_name" ng-model="user.last_name"></div>
    <div ng-if="x.name == 'city'"><input type="text" name="city" ng-model="user.city" ></div>
</div>

所以您不再需要该标志。 records对象是保存字段信息的JSON对象

相关问题