मैं ngx-datatable का उपयोग कर एक पुन: प्रयोज्य डेटाटेबल बना रहा हूं और मैं पंक्ति विस्तार के अंदर गतिशील घटकों को प्रदान करना चाहता हूं। डेटा योग्य घटक एक घटक वर्ग को एक मूल मॉड्यूल से एक तर्क के रूप में प्राप्त करता है और मैं CompComFent को createComponent का उपयोग करता हूं। मैं देख सकता हूं कि डायनेमिक कंपोनेंट के लिए कंस्ट्रक्टर और ऑनइनिट विधियां चल रही हैं, लेकिन इसे DOM से अटैच नहीं किया जा रहा है।
यह वही है जो datable html पंक्ति-विस्तार के लिए दिखता है:
<!-- [Row Detail Template] -->
<ngx-datatable-row-detail rowHeight="100" #myDetailRow (toggle)="onDetailToggle($event)">
<ng-template let-row="row" #dynamicPlaceholder let-expanded="expanded" ngx-datatable-row-detail-template>
</ng-template>
</ngx-datatable-row-detail>
<!-- [/Row Detail Template] -->
और यह मेरी .ts फाइल की तरह दिखता है:
@ViewChild('myDetailRow', {static: true, read: ViewContainerRef}) myDetailRow: ViewContainerRef;
@ViewChild('dynamicPlaceholder', {static: true, read: ViewContainerRef}) dynamicPlaceholder: ViewContainerRef;
renderDynamicComponent(component) {
var componentFactory = this.componentFactoryResolver.resolveComponentFactory(component);
var hostViewConRef1 = this.myDetailRow;
var hostViewConRef2 = this.dynamicPlaceholder;
hostViewConRef1.createComponent(componentFactory);
hostViewConRef2.createComponent(componentFactory);
}
एक और बिंदु यह है कि अगर मेरा #dynamicPlaceholder
एनजी-टेम्प्लेट एनजीएक्स-डिटैटेबल के बाहर रखा गया है, तो यह काम करता है और डायनामिक मॉड्यूल को प्रदान और प्रदर्शित किया जाता है।
<ng-content>
किसी नेस्टेड मार्कअप को रेंडर करने के लिए टैग नहीं है।