如何在AngularJS中显示基于两个下拉列表的内容

How to display content based on two dropdownlists in AngularJS?

本文关键字：下拉列表 于两个 显示 AngularJS      更新时间：2023-09-26

我想显示基于两个下拉列表的内容。我知道如何根据单个下拉列表的选项进行更改。请帮我处理这件事。

这是基于单个下拉列表显示的。我有另一个Branchwise的下线。我被要求根据职业和分支来筛选数据。请帮我

<select ng-model="myVar">
<option value="">CAREER OPTIONS
 <option value="1">HIGHER EDUCATION
  <option value="2">JOBS
  <option value="3">ENTERPRENUERSHIP
</select>
<div ng-switch="myVar">
  <div ng-switch-when="1">
 <h1>H E details</h1>
  </div>
<div ng-switch-when="2">
 <h1>Jobs details</h1>
 </div>
<div ng-switch-when="2">
<h1>Enterprenuership details</h1>
</div>

这是工作plnk，这与您所需要的完全相同，根据从2 dropdown/select中的选择，message会更改

在的每个部分中添加ng-if

<select ng-model="myVar1" ng-change="myVar3 = (myVar1+myVar2)">
    <option value="">CAREER OPTIONS
    <option value="1">HIGHER EDUCATION
    <option value="2">JOBS
    <option value="3">ENTERPRENUERSHIP
</select>
<select ng-model="myVar2" ng-change="myVar3 = (myVar1+myVar2)">
    <option value="">Branch OPTIONS
    <option value="1">Branch 1
    <option value="2">Branch 2
    <option value="3">Branch 3
</select>
<div ng-if="myVar3 ">
    <div ng-if="myVar3 == '11'">
        <h1>H E details</h1>
    </div>
    <div ng-if="myVar3 == '12'">
        <h1>Jobs details</h1>
    </div>
    <div ng-if="myVar3 == '13'">
       <h1>Enterprenuership details</h1>
    </div>
</div>
相关文章：