how to hide a dropdown menu once selected in angularjs

Question

Hello i am new to angularjs and make a demo of dropdown menu ,I want to hide it once any of menu selected,please help me how to do this?

html

  <span class="toolbar-button--quiet navigation-bar__line-height" style="padding: 0;">
        <i class="ion-android-more-vertical" style="font-size: 26px; margin: 0; padding: 0 12px;" dropdown-menu="ddMenuOptions" dropdown-model="ddMenuSelected" dropdown-disabled="dropdownsDisabled"></i>         
    </span>

js

  $scope.ddMenuOptions = [
    {
      text: 'Featured',
      code: 'F'        
    }, {
      text: 'Name (A-Z)',
      code: 'A'
    },{
      text: 'Rating',
      code: 'M'
    },{
      text: ' Most Popular',
      code: 'MP'
    }
  ];

  $scope.ddMenuSelected = {


  };

K K · Accepted Answer · 2015-10-17 05:17:47Z

0

A fiddle would have been better. Nevertheless, you can achieve this by using a flag/variable. This variable gets updated whenever you select or dropdown is shown. Once you select an option, set the variable's value to false/true and then in the HTML tag use ng-show="yourVariable" .

    <span ng-show="yourVariable"></span>

Just make sure you update the value of this variable whenever you open the dropdown and select an option.

answered Oct 17, 2015 at 5:17

K K

18.2k4 gold badges33 silver badges39 bronze badges

Sign up to request clarification or add additional context in comments.

1 Comment

Jigar Makwana Over a year ago

thanks for fast answer dear.but my div is dynamically generating,So i really dont know how to hide it once its selected

Collectives™ on Stack Overflow

how to hide a dropdown menu once selected in angularjs

1 Answer 1

1 Comment

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

1 Comment

Your Answer

Sign up or log in

Post as a guest

Linked

Related