Отображение поля ввода вида на основе условия angularjs

Question

[{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,

Это не должно быть правильным решением, потому что для написания слишком большого количества кода нам нужно использовать что-то еще, что может помочь в чтении формата представления и отображении в зависимости от условий, любая помощь по нему будет очень благодарна заранее, спасибо

Answer 1

Одно из решений, которое вы можете зациклить на своем JSONobject, включает ваше условие в 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-объект, содержащий информацию о вашем поле