fix(ngOptions): allow option with ngIf to be removed and re-added

Fix included from angular#15812

Author: Narretz

src/ng/directive/ngOptions.js

@@ -428,6 +428,9 @@ var ngOptionsDirective = ['$compile', '$document', '$parse', function($compile,
         }
       }
 
+      // The empty option will be compiled and rendered before we first generate the options
+      selectElement.empty();
+
       var providedEmptyOption = !!selectCtrl.emptyOption;
 
       var unknownOption = jqLite(optionTemplate.cloneNode(false));
@@ -544,13 +547,11 @@ var ngOptionsDirective = ['$compile', '$document', '$parse', function($compile,
 
       if (providedEmptyOption) {
 
-        // we need to remove it before calling selectElement.empty() because otherwise IE will
-        // remove the label from the element. wtf?
-        selectCtrl.emptyOption.remove();
-
         // compile the element since there might be bindings in it
         $compile(selectCtrl.emptyOption)(scope);
 
+        selectElement.prepend(selectCtrl.emptyOption);
+
         if (selectCtrl.emptyOption[0].nodeType === NODE_TYPE_COMMENT) {
           // This means the empty option has currently no actual DOM node, probably because
           // it has been modified by a transclusion directive.
@@ -568,8 +569,12 @@ var ngOptionsDirective = ['$compile', '$document', '$parse', function($compile,
               ngModelCtrl.$render();
 
               optionEl.on('$destroy', function() {
+                var needsRerender = selectCtrl.isEmptyOptionSelected();
+
                 selectCtrl.hasEmptyOption = false;
                 selectCtrl.emptyOption = undefined;
+
+                if (needsRerender) ngModelCtrl.$render();
               });
             }
           };
@@ -582,8 +587,6 @@ var ngOptionsDirective = ['$compile', '$document', '$parse', function($compile,
 
       }
 
-      selectElement.empty();
-
       // We need to do this here to ensure that the options object is defined
       // when we first hit it in writeNgOptionsValue
       updateOptions();
@@ -647,16 +650,6 @@ var ngOptionsDirective = ['$compile', '$document', '$parse', function($compile,
 
         var groupElementMap = {};
 
-        // Ensure that the empty option is always there if it was explicitly provided
-        if (providedEmptyOption) {
-
-          if (selectCtrl.unknownOption.parent().length) {
-            selectCtrl.unknownOption.after(selectCtrl.emptyOption);
-          } else {
-            selectElement.prepend(selectCtrl.emptyOption);
-          }
-        }
-
         options.items.forEach(function addOption(option) {
           var groupElement;
 

test/ng/directive/ngOptionsSpec.js

@@ -2536,18 +2536,15 @@ describe('ngOptions', function() {
         scope.isBlank = true;
       });
 
-      expect(element.find('option').length).toBe(2);
-      option = element.find('option').eq(0);
-      expect(option.val()).toBe('');
-      expect(option.text()).toBe('blank');
+      expect(element).toEqualSelect([''], 'object:4');
 
-      scope.$apply(function() {
-        scope.isBlank = false;
-      });
+      scope.$apply('isBlank = false');
 
-      expect(element.find('option').length).toBe(1);
-      option = element.find('option').eq(0);
-      expect(option.text()).toBe('A');
+      expect(element).toEqualSelect(['?'], 'object:4');
+
+      scope.$apply('isBlank = true');
+
+      expect(element).toEqualSelect([''], 'object:4');
     });
 
 
@@ -2567,9 +2564,7 @@ describe('ngOptions', function() {
 
         scope.$apply('isBlank = false');
 
-        options = element.find('option');
-        expect(options.length).toBe(1);
-        expect(options.eq(0).text()).toBe('A');
+        expect(element).toEqualSelect(['?'], 'object:3');
       }
     );