Question

我正在收到来自后端的JSON数据，例如

{
  "data":{
    "xyz":[
      {
        "number":"1",
        "short_text":"Vertrag unterzeichnen",
        "long_text":"Nach Vertrabsunterzeichnung Namen eintragen",
        "is_photo":false
      },
      {
        "number":"2",
        "short_text":"HR unterrichten",
        "long_text":"HR hat eigene Workflows",
        "is_photo":true
      }
    ]
  }
}

在html中，我通过ng-repeat

填充表单

<tr data-ng-repeat="choice in choices track  by $index">
    <td>{{choice.number}}</td>
    <td><p>{{choice.short_text}}</p></td>
    <td><input type="textbox" size="50" class="des-textinput" ng-model="choice.desc" required></td>
    <td><input type="checkbox"  ng-model="choice.include"></td>
    <td><input type="file" id="abc{{$index}}" class="photo-upload"
               file-model="pic{{$index}}" accept="image/*">
    </td>
</tr>

现在，如果我收到的JSON中is_photo的值为true，我想要输入所需的输入类型文件。对于每一行，如果is_photo的值为false，则不需要它。

从给定的JSON开始，条件将是第一行is_photo为false时不需要的第一个输入类型文件，但第二行将需要作为{{1}的值是is_photo。

我该怎么做？

Answer 1

您可以使用＆＃34; ng-required＆＃34;

有关文档，您可以阅读：https://docs.angularjs.org/api/ng/directive/ngRequired

喜欢这个

<input name="myInput" ng-model="myInput" ng-required="myVar == 2">

//If photo is true required will be true else false
<input name="myInput" ng-model="myInput" ng-required="_photo">

<input name="myInput" ng-model="myInput" ng-required="choice.is_photo">

//Or use some function which returns boolean
<input name="myInput" ng-model="myInput" ng-required="isRequired(choice)">

//This is how you would use it with form and stop form from submittion    
<form ng-app="myApp" ng-controller="validateCtrl"
      ng-init="isRequired=true"
      name="myForm" novalidate ng-submit="myForm.$valid && submit()">
        Username: <input type="text" name="user" ng-model="user" 
                         ng-required="isRequired">
        Email : <input type="email" name="email" ng-model="email" required>
        <input type="submit" ng-click="isRequired=!isRequired;" />
</form>

    <script>
       var app = angular.module('myApp', []);
       app.controller('validateCtrl', function($scope) {
           $scope.user = 'John Doe';
           $scope.email = 'john.doe@gmail.com';
           $scope.submit = () => {console.log("s");}
       });
    </script>

Answer 2

你使用这个用途

如果_photo为真，它将自动设置

<input name="myInput" ng-model="myInput" ng-required="_photo">

Answer 3

您可以使用 ng-required 属性。 ref ng-required

<input type="file" id="abc{{$index}}" class="photo-upload"
       file-model="pic{{$index}}" accept="image/*"
       ng-required="choice.is_photo == true" />

根据AngularJS中的条件生成所需的输入类型文件

3 个答案: