angular / angular/components

bug(cdk-virtual-scroll-viewport): Content not present in SSR load

Abierto
#24,956 7 comentarios 5 reacciones 0 asignados Ver en GitHub
area: cdk/scrolling P3
Lenguaje dominante
TypeScript
Estrellas
25k
Forks
6.8k
Merge medio
1 d 8 h
PR fusionados (30 d)
91

Descripción

### Is this a regression?

- [ ] Yes, this behavior used to work in the previous version

### The previous version in which this bug was not present was

_No response_

### Description

When rendering a page in SSR mode, the content for the virtual scroll is not rendered. It's blank. The page works fine when rendered in the browser. Screenshot attached for the SSR load response
Screenshot 2022-05-23 at 4 31 22 PM
:

### Reproduction

Steps to reproduce:
1. Clone the repo https://github.com/bivs06/angular-universal-ssr-bug
2. Run `npm run dev:ssr`
3. Check the response in the network tab

StackBlitz link: https://stackblitz.com/edit/angular-ivy-kfyv87?file=src%2Fapp%2Fapp.component.html

### Expected Behavior

The items for virtual scroll should load in SSR load

### Actual Behavior

The items for the virtual scroll are not loading in the SSR load

### Environment

- Angular:
- CDK/scrolling:
- Browser(s):
- Operating System (e.g. Windows, macOS, Ubuntu):

Guía de contribución

Abrir la guía de contribución

Línea de trabajo

Clona el repositorio angular-universal-ssr-bug enlazado y ejecuta `npm run dev:ssr`; compara la respuesta de red con la página renderizada por el navegador. Empieza con la reproducción en `src/app/app.component.html` del enlace de StackBlitz y el comportamiento de `cdk-virtual-scroll-viewport`. Está terminado cuando los elementos de virtual-scroll aparecen tanto en la respuesta SSR como en el navegador.

Escrito por el modelo de indexación a partir del texto del issue.

Evaluación

Stack tecnológico
angular, typescript
Área
frontend
Tipo de issue
Error
Dificultad
4/5
Tiempo estimado
3-5 días
Estado de actividad
Estancado
Claridad
Bastante claro
Aptitud para principiantes
30/100

Recibe los nuevos issues en tu correo

Un resumen breve de issues de GitHub para principiantes.