I am still new to learning about angular and I am facing an issue with a dropdown menu for gender. I want to add a "--Select--" option, but it ends up duplicating.
Below is the code snippet:
<td style="font-family: Brandon-Grotesque, Helvetica Neue, Helvetica, Arial, sans-serif; font-size: 25px;">
<select name="gender" ng-model="formData.gender" ng-options="option.name for option in formData.availableOptions track by option.id"></select>
</td>
Here is the corresponding angular code:
//var app = angular.module('formApp',['ngMaterial']);
var app = angular.module('formApp',[]);
app.controller('formController',function($scope,$http,$httpParamSerializer){
$scope.formData = {
availableOptions: [
{id:"",name:"--Select--"},
{id:"male",name:"Male"},
{id:"female",name:"Female"}
],
gender:{id:"",name:"--Select--"}
};
});
</script>