Return to Question

I am facing a problem in the following code in my lwc component.

Whenever I try to append a child dynamically from Js in LWC component. I got this error.

HTML :

<template>

<lightning-combobox

name="comboType" value={comboboxValues}

label="label" onchange={handleChange}

placeholder="nnnn" class="margin-bottom-8"

options={Options}

required>

</lightning-combobox>

 

<div data-id="overview" lwc:dom="manual">

</div>

</template>

 

JS :

handleChange(event){

var element = this.template.querySelector('[data-id="overview"]');

child = '<c-lwc_simulation></c-lwc_simulation>';

element.appendChild(child);

}

I am facing a problem in the following code in my lwc component.

Whenever I try to append a child dynamically from Js in LWC component. I got this error.

HTML :

<template>
    <lightning-combobox
        name="comboType" value={comboboxValues}
        label="label" onchange={handleChange}
        placeholder="nnnn" class="margin-bottom-8"
        options={Options}
        required>
    </lightning-combobox>
    
    <div data-id="overview" lwc:dom="manual"></div>
</template>

JS :

    handleChange(event){
    
        var element = this.template.querySelector('[data-id="overview"]');
    
        child = '<c-lwc_simulation></c-lwc_simulation>';
    
        element.appendChild(child);
    
    }

I am facing a problem in the following code in my lwc component.

Whenever I try to append a child dynamically from Js in LWC component. I got the following error.

HTML :

<template>

<lightning-combobox

name="comboType" value={comboboxValues}

label="label" onchange={handleChange}

placeholder="nnnn" class="margin-bottom-8"

options={Options}

required>

</lightning-combobox>

 

<div data-id="overview" lwc:dom="manual">

</div>

</template>

 

JS :

handleChange(event){

var element = this.template.querySelector('[data-id="overview"]');

child = '<c-lwc_simulation></c-lwc_simulation>';

element.appendChild(child);

}

I am facing a problem in the following code in my lwc component.

Whenever I try to append a child dynamically from Js in LWC component. I got this error.

HTML :

<template>

<lightning-combobox

name="comboType" value={comboboxValues}

label="label" onchange={handleChange}

placeholder="nnnn" class="margin-bottom-8"

options={Options}

required>

</lightning-combobox>

 

<div data-id="overview" lwc:dom="manual">

</div>

</template>

 

JS :

handleChange(event){

var element = this.template.querySelector('[data-id="overview"]');

child = '<c-lwc_simulation></c-lwc_simulation>';

element.appendChild(child);

}

I am facing a problem in the following code in my lwc component.

Whenever I try to append a child dynamically from Js in LWC component. I got the following error.

HTML :

<template>

<lightning-combobox

name="comboType" value={comboboxValues}

label="label" onchange={handleChange}

placeholder="nnnn" class="margin-bottom-8"

options={Options}

required>

</lightning-combobox>

 

<div data-id="overview" lwc:dom="manual">

</div>

</template>

 

JS :

handleChange(event){

var element = this.template.querySelector('[data-id="overview"]');

child = '<c-lwc_simulation></c-lwc_simulation>';

element.appendChild(child);

}

I am facing a problem in the following code in my lwc component.

Whenever I try to append a child dynamically from Js in LWC component. I got the following error.

HTML :

<template>

<lightning-combobox

name="comboType" value={comboboxValues}

label="label" onchange={handleChange}

placeholder="nnnn" class="margin-bottom-8"

options={Options}

required>

</lightning-combobox>

 

<div data-id="overview" lwc:dom="manual">

</div>

</template>

 

JS :

handleChange(event){

var element = this.template.querySelector('[data-id="overview"]');

child = '<c-lwc_simulation></c-lwc_simulation>';

element.appendChild(child);

}