如何在Angular 2中使用snackBar

Question

我使用sanckbar，但它的位置不在底部

可能是什么问题？

git https://github.com/ashjha/snakebar

Answer 1

如果没有提供代码，很难检查出错了什么。 但是，我正在使用MdSnackBar（仍处于开发阶段），并且它正在为我工​​作。

首先，＆＃34; snackbar组件＆＃34;本身必须包括在内，以及＆＃34; MdSnackBarConfig＆＃34;使用：

import { MdSnackBar, MdSnackBarConfig } from '@angular/material';
import { ViewContainerRef } from '@angular/core';

在此之后，我们可以在构造函数中创建或初始化snackbar项目和viewContainerRef：

 constructor(
    private snackbar: MdSnackBar,
    public viewContainerRef: ViewContainerRef,
  ) { }

现在我们可以随时调用小吃店，使用：

   let config = new MdSnackBarConfig(this.viewContainerRef);
   this.snackbar.open('Snackbar text', 'Ok', config);

请参阅github以获取更多信息和更新，因为这是初始版本。

希望这有点帮助

Answer 2

希望这会对你有所帮助：

import { MdSnackBar } from '@angular/material';
export class DemoStackOverflow{
    constructor(
        private snackBar: MdSnackBar
    ){}

    showSnackBar(){
        this.snackBar.open("Yes i am Coming", "Ok", {
            duration: 9000
        }
    }
}

Answer 3

将ViewContainerRef传递给config会将快餐栏限制为相同。你应该通过config.viewContainerRef = null。这会将snackBar放在页面的中心。