angular · tbosch · Jul 16, 2015 · Jul 16, 2015
diff --git a/modules/angular2/src/core/compiler/view_manager.ts b/modules/angular2/src/core/compiler/view_manager.ts
@@ -188,7 +188,8 @@ export class AppViewManager {
 
     var embeddedFragmentView = contextView.getNestedView(contextBoundElementIndex);
     var view;
-    if (isPresent(embeddedFragmentView) && !embeddedFragmentView.hydrated()) {
+    if (protoView.type === ViewType.EMBEDDED && isPresent(embeddedFragmentView) &&
+        !embeddedFragmentView.hydrated()) {
       // Case 1: instantiate the first view of a template that has been merged into a parent
       view = embeddedFragmentView;
       this._attachRenderView(parentView, boundElementIndex, atIndex, view);

diff --git a/modules/angular2/src/render/dom/dom_renderer.ts b/modules/angular2/src/render/dom/dom_renderer.ts
@@ -83,8 +83,10 @@ export class DomRenderer extends Renderer {
   attachFragmentAfterFragment(previousFragmentRef: RenderFragmentRef,
                               fragmentRef: RenderFragmentRef) {
     var previousFragmentNodes = resolveInternalDomFragment(previousFragmentRef);
-    var sibling = previousFragmentNodes[previousFragmentNodes.length - 1];
-    moveNodesAfterSibling(sibling, resolveInternalDomFragment(fragmentRef));
+    if (previousFragmentNodes.length > 0) {
+      var sibling = previousFragmentNodes[previousFragmentNodes.length - 1];
+      moveNodesAfterSibling(sibling, resolveInternalDomFragment(fragmentRef));
+    }
   }
 
   attachFragmentAfterElement(elementRef: RenderElementRef, fragmentRef: RenderFragmentRef) {
@@ -253,7 +255,7 @@ export class DomRenderer extends Renderer {
 }
 
 function moveNodesAfterSibling(sibling, nodes) {
-  if (isPresent(DOM.parentElement(sibling))) {
+  if (nodes.length > 0 && isPresent(DOM.parentElement(sibling))) {
     for (var i = 0; i < nodes.length; i++) {
       DOM.insertBefore(sibling, nodes[i]);
     }

diff --git a/modules/angular2/test/core/compiler/view_manager_spec.ts b/modules/angular2/test/core/compiler/view_manager_spec.ts
@@ -300,6 +300,22 @@ export function main() {
 
         });
 
+        describe('create a host view', () => {
+
+          it('should always create a new view and not use the embedded view', () => {
+            var newHostPv = createHostPv([createNestedElBinder(createComponentPv())]);
+            var newHostView =
+                internalView(manager.createViewInContainer(vcRef, 0, wrapPv(newHostPv), null));
+            expect(newHostView.proto).toBe(newHostPv);
+            expect(newHostView).not.toBe(hostView.views[2]);
+            expect(viewListener.spy('viewCreated')).toHaveBeenCalledWith(newHostView);
+            expect(renderer.spy('createView'))
+                .toHaveBeenCalledWith(newHostPv.mergeMapping.renderProtoViewRef,
+                                      newHostPv.mergeMapping.renderFragmentCount);
+          });
+
+        });
+
       });
     });
 

diff --git a/modules/angular2/test/render/dom/dom_renderer_integration_spec.ts b/modules/angular2/test/render/dom/dom_renderer_integration_spec.ts
@@ -197,6 +197,33 @@ export function main() {
              });
        }));
 
+    it('should add and remove empty fragments',
+       inject([AsyncTestCompleter, DomTestbed], (async, tb: DomTestbed) => {
+         tb.compileAndMerge(someComponent,
+                            [
+                              new ViewDefinition({
+                                componentId: 'someComponent',
+                                template: '<template></template><template></template>',
+                                directives: []
+                              })
+                            ])
+             .then((protoViewMergeMappings) => {
+               var rootView = tb.createView(protoViewMergeMappings[0]);
+
+               var elr = elRef(rootView.viewRef, 1);
+               expect(rootView.hostElement).toHaveText('');
+               var fragment = rootView.fragments[1];
+               var fragment2 = rootView.fragments[2];
+               tb.renderer.attachFragmentAfterElement(elr, fragment);
+               tb.renderer.attachFragmentAfterFragment(fragment, fragment2);
+               tb.renderer.detachFragment(fragment);
+               tb.renderer.detachFragment(fragment2);
+               expect(rootView.hostElement).toHaveText('');
+
+               async.done();
+             });
+       }));
+
     it('should handle events', inject([AsyncTestCompleter, DomTestbed], (async, tb: DomTestbed) => {
          tb.compileAndMerge(someComponent,
                             [