troubleshooting Question

Display content based on dropdown selected value in Angular

Avatar of ksd123
ksd123 asked on
JavaScriptHTML
2 Comments1 Solution15920 ViewsLast Modified:
Hi Experts,

I am newbie to Angular and have a requirement to show the content based on dropdown value in Angular.I have following dropdown  values

None: show no content
Name: Show "Name" content only
Address:Show "Address" content only
All: Show both "Name" and "Address" contents.

I have below code developed in Visual Studio editor which is  working fine (UI screenshots attached ) using Angular,Bootstrap and HTML5.

I need sample working code for my requirement.

<div class="container" >

  <div style="padding:50px;" ng-controller="samplecontroller">

 <div class="row">
     <label class="col-lg-2">
         Status</label>
     <div class="col-lg-5">
         <select class="input-sm">
             
             <option selected value="none">None</option>
             <option value="name">Name</option>
             <option value="address">Address</option>
             <option value="all">All</option>
         </select>
     </div>
 </div>
 </br>
    
  <div class="row">
         <label class="col-lg-2">
             Name</label>
         <div class="col-lg-5">
             <p class="form-group">
                 {{name}}</p>
         </div>

     </div>
 </br>
     
     <div class="row">
                <label class="col-lg-2">
                     Address</label>
                 <div class="col-lg-5">
                    <p class="form-group">
                        {{address}}</p>
                  </div>

       </div>

   </div>

 </div>

<script type="text/javascript">
        function samplecontroller($scope) {
            $scope.name = "FOO";
            $scope.address = "ADDRESS1";
      
        
        }

Thanks in Advance
image1.JPG
image2.JPG
ASKER CERTIFIED SOLUTION
leakim971
Multitechnician
Join our community to see this answer!
Unlock 1 Answer and 2 Comments.
Start Free Trial
Learn from the best

Network and collaborate with thousands of CTOs, CISOs, and IT Pros rooting for you and your success.

Andrew Hancock - VMware vExpert
See if this solution works for you by signing up for a 7 day free trial.
Unlock 1 Answer and 2 Comments.
Try for 7 days

”The time we save is the biggest benefit of E-E to our team. What could take multiple guys 2 hours or more each to find is accessed in around 15 minutes on Experts Exchange.

-Mike Kapnisakis, Warner Bros