如何从下拉菜单中选择选项

Question

I have one input box and besides that, I have on image. After clicking on image, I am opening one drop-down there with some options which is coming from controller. If I select something from drop-down, it is going to enter in text-box. Like that we can insert multiple option from drop-down with comma separated one. I am able to enter single selected option from drop-down to text-box.

I need help is :

1. How to multiselect options and enter in textbox
2. How to avoid duplication option selection while entering.

This is all I need to do in Angular js.

Below is my controller:

              $scope.onDropDdownChange = function (dropdownFieldName, textFiledName,splitSelItem) {
                    let rpInfo = $scope.restrictedPartyInfo;
                    let selItem = rpInfo[dropdownFieldName] ? (splitSelItem ? (rpInfo[dropdownFieldName]).split("-")[0] : rpInfo[dropdownFieldName]) : '';
                    if(rpInfo[textFiledName]) {
                        var isExist = rpInfo[textFiledName].indexOf(selItem);                           
                        if(isExist)
                            rpInfo[textFiledName] += ',' + selItem;                         
                    } else {
                        rpInfo[textFiledName] = selItem;
                    }
                }; 

And below is my HTML Part:

            <td width="10%" class="gridInfoAddEditTableData">Customer Types*</td>
                <td width="9%" class="gridInfoAddEditTableData">                    
                    <img id="followbutton" ng-src="{{followButtonImg}}" alt="Show Hide"
                    ng-click="ShowHideCusttyp();toggleImageCustTyp()"  ng-model="restrictedPartyInfo.ShowHideCusttyp">
                    <input type="text" id="customertypes" style="width:54%" ng-click="ShowHideCusttyp();"
                    ng-model="restrictedPartyInfo.customerType"
                    ng-keydown="ShowHideCusttyp();"/>
                </td>


          <td align="center" class="gridInfoAddEditTableData">              
                 <select  multiple ng-show = "Visible" name="customerTypess"  ng-change="ShowHideCusttyp();onDropDdownChange('customerTypes','customerType',false);"
                ng-model="restrictedPartyInfo.customerTypes"
                style="position: relative; align: center; top: 1px; left: 245%; width: 150%; height: 65px;"
                ng-init="customerTypess ='val_customerTypess'" >
                    <option ng-repeat="custtyp in customerTypes" value="{{custtyp.clientTypeCode}}">{{custtyp.clientTypeCode}} – {{custtyp.clientDescription}}</option>
                </select>               
            </td>

Answer 1

For 1. Use Multiple tag of html , You have to use Ctrl + mouse click https://www.w3schools.com/tags/tryit.asp?filename=tryhtml_select_multiple and you will get array of selected data which use can show in Comma Seprated Way

For 2. Use can use loop after selection of multiple data from dropdown You can restrict during Selection like if already in array then remove, NG-change may help Remove duplicate data coming from Server :)