Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Example 22 shows temp ng-template being rendered for a short period #1273

Closed
5 tasks done
ghiscoding opened this issue Sep 25, 2023 · 0 comments
Closed
5 tasks done

Comments

@ghiscoding
Copy link
Owner

ghiscoding commented Sep 25, 2023

Describe the bug

For a very short period of time it shows the ng-select ng-template being created for every cell being interpreted. I did see that a while ago but never spent much time investigating it but it looks like the ng-template shows up in the DOM before being transitioned into the grid cell, I'm not sure if we need some hidden CSS somewhere to avoid seeing these pre-render in the DOM, it still shows in the online demo, perhaps it's because I think we have setTimeout to wait for a lifecycle, that might be the cause of why it happens quickly (transitioned on next cycle into the grid cell, it might be it)

I tried with ChangeDetectorRef and this.cd.detectChanges(); (or markForCheck()) but that doesn't seem to be enough for it to detect the change in the DOM

Reproduction

Go to Example 22 then start scrolling and watch the bottom of the grid, you will see that all cell data are being rendered below the grid before being transitioned to the cell itself

it happens very fast, I only managed to see it after adding a breakpoint for a tree change, these temp ng-template are what will show in the 3rd column "Assignee with Angular Component". I don't I had that problem originally and I think it's recent

image

Expectation

it shouldn't show these temp ng-template below the grid

Environment Info

System:
    OS: Windows 10 10.0.19045
    CPU: (12) x64 Intel(R) Core(TM) i7-8850H CPU @ 2.60GHz   
    Memory: 10.44 GB / 31.75 GB
  Binaries:
    Node: 18.17.1 - C:\Program Files\nodejs\node.EXE
    Yarn: 1.22.19 - C:\Program Files (x86)\Yarn\bin\yarn.CMD 
    npm: 9.6.7 - C:\Program Files\nodejs\npm.CMD
    pnpm: 8.6.12 - ~\AppData\Local\pnpm\pnpm.CMD
  Browsers:
    Chrome: 116.0.5845.188
    Edge: Spartan (44.19041.1266.0), Chromium (117.0.2045.36)
    Internet Explorer: 11.0.19041.1566

Validations

ghiscoding added a commit that referenced this issue Sep 26, 2023
feat: improve AngularUtilService methods to create dynamic component, fixes #1273
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Projects
None yet
Development

No branches or pull requests

1 participant