Question

您好我想做一个简单的angularjs过滤器，所以我有这个：

      <input type="text" id="name" style="display:block" class="form-control" placeholder="By name" ng-model="search.student_name">
      <input type="text" id="code" style="display:none" class="form-control" placeholder="By code" ng-model="search.student_code">
      <input type="text" id="room" style="display:none" class="form-control" placeholder="By room" ng-model="search.student_room">
      <select name="filter" id="filter">
        <option value="name">Name</option>
        <option value="code">Code</option>
        <option value="room">Room</option>
      </select>

和测试脚本（不起作用...... Jquery冲突）

 <script type="text/javascript">

  if(document.getElementbyId('filter').value === 'code'){
    document.getElementbyId('name').style.display="none";
    document.getElementbyId('code').style.display="block";
  };

 </script>

问题是：还有另一种显示和隐藏所选输入的方法吗？我可以在服务器端进行吗？

Answer 1

使用AngularJS，您可以使用NgShow选择性地显示项目。

<div ng-app>

<input type="text" id="name" style="display:block" class="form-control" placeholder="By name" ng-model="search.student_name" ng-show="filter =='name'">
      <input type="text" id="code" style="display:none" class="form-control" placeholder="By code" ng-model="search.student_code" ng-show="filter =='code'">
      <input type="text" id="room" style="display:none" class="form-control" placeholder="By room" ng-model="search.student_room" ng-show="filter =='room'">
      <select name="filter" id="filter" ng-model="filter">
        <option value="name">Name</option>
        <option value="code">Code</option>
        <option value="room">Room</option>
      </select>

</div>

我已经为每个输入字段的select和ng-model指令添加了ng-show。它们只会显示select的值是否等于ng-show

中的文字

这假设页面中已经引用了角度。

Angularjs - 如何进行选择 - 选项过滤器

1 个答案: