如何在模板上管理多个选择控件？

Question

我正在寻求咨询。 HTML：

<div id='masterBlock'>
   <div combo-box id='divComboBox1' ng-if='isShow1'>
      <select id='selectData2'>
         <option ng-repeat='item in dataArr1'>{{ item.name }}</option>
      </select>
   </div>
   <div combo-box id='divComboBox2' ng-if='isShow2'>
      <select id='selectData2'>
         <option ng-repeat='item in dataArr2'>{{ item.size }}</option>
      </select>
   </div>
</div>

JS：

.directive('comboBox', ['data', function(data) {
        return {
            restrict: 'A',
            link: function($scope, element, attrs) {                
                $(element).find('select').combobox().on('change', function(eventObj) {
                    switch($(this)[0].id) {
                        case 'selectData1': selectData1Change(eventObj); break;
                        case 'selectData2': selectData2Change(eventObj); break;
                        default: break; 
                    }                                                                       
                });
                //
                function selectData1Change(eventObj) {
                    alert('1');
                }
                //
                function selectData2Change(eventObj) {
                    alert('2');
                }
            }
        }
    }])

两个＆＃39; div＆＃39;块具有相同的指令＆＃39;组合框＆＃39;。在指令中我选择＆＃39;选择＆＃39;元素jQuery-UI组合框插件和设置chenge函数。如果需要，我使用ng-if隐藏div＃divComboBox1或div＃divComboBox2，＆＃39; div＆＃39;通过指令保持可见的块。我可以设置指令＆＃39;组合框＆＃39;在div＃masterBlock上，但在这种情况下，我在管理其中的隐藏/显示块时遇到了一些问题。在指令$（元素）.find（＆＃39; select＆＃39;）。length =＆gt; 0，因为如果工作更快，那么指令。我该怎么办？避免将来出现问题。