angular / angular/components

feat(SnackBar): allow to define a container in which to render the snackbar

Ouverte
#7,764 12 commentaires 26 réactions 0 personnes assignées Voir sur GitHub
area: material/snack-bar feature needs: discussion P5
Langage dominant
TypeScript
Étoiles
25k
Forks
6.8k
Merge moyen
1 j 8 h
PR mergées (30 j)
91

Description

#### Bug, feature request, or proposal:
feature request

#### What is the expected behavior?
There should be a setting to define a container in which the snackbar is positioned in.

#### What is the current behavior?
SnackBar is always positioned based on the viewport.

#### What are the steps to reproduce?
https://stackblitz.com/edit/angular-material2-issue-ddtruw

#### What is the use-case or motivation for changing an existing behavior?
I have an app with a static main toolbar at the top. When i position the snackbar to "top right" it will be shown above the main toolbar (see stackblitz example). I would like it to be shown at the top right of the container below the main toolbar (".basic-container" in my stackblitz example).

#### Which versions of Angular, Material, OS, TypeScript, browsers are affected?
angular 4.4.2
angular-material 2.0.0 - Beta12
Chrome 61.0.3163.100

#### Is there anything else we should know?
MatSnackBarConfig has a viewContainerRef property. At first i thought this would be exactly what i need but when i tried to change it, it didn't seem to do anything. In the documentation of the MatDialog component (which also has a viewContainerRef property) it is stated that this property does not affect the place where it is rendered. I assume the same goes for MatSnackBar.

Guide de contribution

Ouvrir le guide de contribution

Piste de recherche

Commencez par la reproduction StackBlitz liée et examinez MatSnackBarConfig.viewContainerRef, en comparant son comportement avec le placement demandé de .basic-container. C'est terminé lorsqu'un paramètre permet à la SnackBar d'être rendue et positionnée dans le conteneur choisi plutôt que dans le viewport.

Rédigé par le modèle d'indexation à partir du texte de l'issue.

Évaluation

Stack technique
angular, typescript
Domaine
frontend
Type d'issue
Fonctionnalité
Difficulté
4/5
Temps estimé
3-5 jours
Activité
À l'abandon
Clarté
Plutôt claire
Accessibilité débutants
35/100

Recevez les nouvelles issues par e-mail

Un résumé court des issues GitHub adaptées aux débutants.