Question

我有以下HTML代码：

  <div class="form-group">
    <label class="control-label col-sm-2" for="inputColor">Collor</label>
    <div class="col-sm-6">
      <input type="radio" ng-model="form.add.color" name="color" value="red">  red
      <input type="radio" ng-model="form.add.color" name="color" value="green">  green
    </div>
  </div>

  <div class="form-group">
    <label class="control-label col-sm-2" for="inputProbleme">Problème</label>
    <div class="col-sm-6">
      <input type="text" class="form-control" id="inputProbleme" ng-model="form.add.probleme" name="probleme" placeholder="">
    </div>
  </div>

  <div class="form-group">
    <label class="control-label col-sm-2" for="inputDate">Date</label>
    <div class="col-sm-6">
      <input type="date" class="form-control" id="inputDate" ng-model="form.add.date" name="date" placeholder="">
    </div>
  </div>  

  <div class="form-group">
    <label class="control-label col-sm-2" for="inputService">Service</label>
    <div class="col-sm-6">
      <input type="number" class="form-control" id="inputService" ng-model="form.add.service" name="service" placeholder="123...">
    </div>
  </div>            

  <div class="form-group">
    <label class="control-label col-sm-2" for="inputVu">Vue</label>
    <div class="col-sm-6">
      <input type="radio" ng-model="form.add.vu" name="vu" value="true">  True
      <input type="radio" ng-model="form.add.vuD" name="vu" value="false">  False
    </div>
  </div>

所以我想在这里做的是，当我选择“红色”时，表格将显示“proleme”和“date”输入以填写，当我选择绿色时，它将显示“service”和“vue” 。我知道我们可以使用jquery或javascript，但是如何处理Angularjs？

Answer 1

简单如此地狱。选择红色后，form.add.color的值将为'red'。而选择绿色时，其值将为'green'。

所以你只需要根据你的选择在你想要显示/隐藏的div上使用ngShow directive：

<div class="form-group" ng-show="form.add.color == 'red'">

或

<div class="form-group" ng-show="form.add.color == 'green'">

如果在angularjs中选择了另一个表单字段，则如何显示表单字段

1 个答案: