Add select option by using <a> in AngularJS?

Issue

How can I add more select option in AngularJS example like this:

<div ng-app="MyApp" ng-controller="MyController">
    <label>Student Class:</label>
    <select id="class" name="class">
      <option>C1608G</option>
    </select>
    <a href="#" id="add" style="color: blue;">Add class</a>
</div>

Solution

You can use either attributes/directives:

  • ng-options in your select element
  • ng-repeat in your option element

Here’s an example(suppose that you have an array of objects names ‘options’ in your $scope):

<select id="class" name="class" ng-options="option as option.name for option in options track by option.value">
</select>

<select id="class" name="class">
  <option ng-repeat="option in options">
     <a href="option.address">{{option.name}}</a>
  </option>
</select>

Answered By – mindthefrequency

Answer Checked By – Katrina (AngularFixing Volunteer)

Leave a Reply

Your email address will not be published.