Stuck on an issue?

Lightrun Answers was designed to reduce the constant googling that comes with debugging 3rd party libraries. It collects links to all the places you might be looking at while hunting down a tough bug.

And, if you’re still stuck at the end, we’re happy to hop on a call to see how we can help out.

Mitosis angular output accessing nativeElement when undefined

See original GitHub issue

I am interested in helping provide a fix!

Yes

Which generators are impacted?

All
Angular
HTML
Qwik
React
React-Native
Solid
Stencil
Svelte
Vue
Web components

Reproduction case

https://mitosis.builder.io/?outputTab=IYOw5grgNsBOQ%3D%3D%3D&code=JYWwDg9gTgLgBAbzhAdgVTAEwIYwKYA0cArgM54BKeAZnAL5zVQQhwBEAAgEbHAA2mPFAB0wCAHoQwGBFLBSbANwAoZXgAekWHEHVsxPvGrEUAYxhiUcALIBPAMItIKPChgAKAJSJlcOKdRSeFIWSho4AF4ScipqAB5sFFsAPncUAz5PFT9UDBx8dy9I5J8%2FP2BadwBCEJAw6m8EXzK%2FKDwYYigUbLK6VT86IgBtWvqAXSz%2BuDaOrrh3Zr84zGAAN0WytuoIhFHYvpbkjb9hU4248RXVo79JvqA%3D

Expected Behaviour

Angular output

    if (!this.someRef?.nativeElement) {
      return;
    }

Actual Behaviour

Angular output

    if (!this.someRef.nativeElement) {
      return;
    }

Additional Information

Shows errors in the console “ERROR TypeError: Cannot read properties of undefined (reading ‘nativeElement’)” see stackblitz

Also causes other issues where classes inside “classNames” function do not appear in the dom when they should.

Issue Analytics

State:
Created 10 months ago
Comments:11 (6 by maintainers)

Top GitHub Comments

1reaction

chadalencommented, Nov 10, 2022

Closing this ticket since with Patrick’s solution the nativeElement is no longer undefined.

1reaction

PatrickJScommented, Nov 9, 2022

yeah you do const fn = useRef((evt) => handleClickOutside(evt)); so the mitosis angular output would need to be updated later

Top Results From Across the Web

Angular: nativeElement is undefined on ViewChild

But when I try to access the nativeElement property, it's undefined . Below is the snippet. import { Component, ViewChild, AfterViewInit } from ......

When using @ViewChild element.nativeElement is undefined

This is working as expected. When using @ViewChild in this way, Angular will provide the directive instance.

Cannot read property 'nativeElement' of undefined and ...

It seems clear to me that Angular is failing to grab the #cardElement but I can't see what's wrong in the code. subscriptions.component.html...

ILSI - Springer Link

The present volume is one of a series concerned with topics considered to be of growing interest to those whose ultimate aim is....

3458.txt - Project Gutenberg

YOU USE OR READ THIS ETEXT By using or reading any part of this PROJECT ... The per- 68:24 petuation of the floral...