fix(ivy): nested ngFor should be supported (#24564)

PR Close #24564

packages/core/src/render3/di.ts

@@ -590,6 +590,7 @@ export function getOrCreateContainerRef(di: LInjector): viewEngine_ViewContainer
 
     lContainerNode.tNode = hostTNode.dynamicContainerNode;
     vcRefHost.dynamicLContainerNode = lContainerNode;
+    lContainerNode.dynamicParent = vcRefHost;
 
     addToViewTree(vcRefHost.view, hostTNode.index as number, lContainer);
 
@@ -649,6 +650,7 @@ class ViewContainerRef implements viewEngine_ViewContainerRef {
     (viewRef as EmbeddedViewRef<any>).attachToViewContainerRef(this);
 
     insertView(this._lContainerNode, lViewNode, adjustedIdx);
+    lViewNode.dynamicParent = this._lContainerNode;
 
     this._viewRefs.splice(adjustedIdx, 0, viewRef);
 
@@ -672,7 +674,8 @@ class ViewContainerRef implements viewEngine_ViewContainerRef {
 
   detach(index?: number): viewEngine_ViewRef|null {
     const adjustedIdx = this._adjustIndex(index, -1);
-    detachView(this._lContainerNode, adjustedIdx);
+    const lViewNode = detachView(this._lContainerNode, adjustedIdx);
+    lViewNode.dynamicParent = null;
     return this._viewRefs.splice(adjustedIdx, 1)[0] || null;
   }
 

packages/core/src/render3/instructions.ts

@@ -318,7 +318,8 @@ export function createLNodeObject(
     queries: queries,
     tNode: null !,
     pNextOrParent: null,
-    dynamicLContainerNode: null
+    dynamicLContainerNode: null,
+    dynamicParent: null
   };
 }
 

packages/core/src/render3/interfaces/node.ts

@@ -111,6 +111,12 @@ export interface LNode {
    */
   // TODO(kara): Remove when removing LNodes
   dynamicLContainerNode: LContainerNode|null;
+
+  /**
+   * A pointer to a parent LNode created dynamically and virtually by directives requesting
+   * ViewContainerRef. Applicable only to LContainerNode and LViewNode.
+   */
+  dynamicParent: LElementNode|LContainerNode|LViewNode|null;
 }
 
 
@@ -129,6 +135,7 @@ export interface LTextNode extends LNode {
   native: RText;
   readonly data: null;
   dynamicLContainerNode: null;
+  dynamicParent: null;
 }
 
 /** Abstract node which contains root nodes of a view. */

packages/core/src/render3/node_manipulation.ts

@@ -42,7 +42,10 @@ export function getParentLNode(node: LContainerNode | LElementNode | LTextNode |
 export function getParentLNode(node: LViewNode): LContainerNode|null;
 export function getParentLNode(node: LNode): LElementNode|LContainerNode|LViewNode|null;
 export function getParentLNode(node: LNode): LElementNode|LContainerNode|LViewNode|null {
-  if (node.tNode.index === -1) return null;
+  if (node.tNode.index === -1) {
+    // This is a dynamic container or an embedded view inside a dynamic container.
+    return node.dynamicParent;
+  }
   const parent = node.tNode.parent;
   return parent ? node.view[parent.index] : node.view[HOST_NODE];
 }