我需要将样式应用于调用特定功能时要使用的烤面包。我怎么做?

toast.service.ts

import { Injectable, OnInit } from '@angular/core';
import { BehaviorSubject } from 'rxjs/BehaviorSubject';

@Injectable()
export class ToastrService {

    public toasterStatus: BehaviorSubject<Message>;

    constructor() {
        this.toasterStatus = new BehaviorSubject<Message>(null);
    }
    showToaster(type: string, content: string) {
        const toasterObj: Message = { severity: type, detail: content };
        this.toasterStatus.next(toasterObj);
    }
}

export interface Message {
    severity: String;
    detail: String;
}


我的component.ts

import { ToastrService } from '../../../toast.service';

@Component({
  selector: '...',
  templateUrl: './my.component.html',
  styleUrls: ['./my.component.css']
})
export class MyComponent implements OnInit, OnDestroy {
constructor(private logService: LogService,
    private toastrService: ToastrService,){...}

ngOnInit() {

    this.idSubscription$ = this.route.params.subscribe(params => {
      this.id = +params['id'];
    });
    this.logService.debug(this.id);


      // check for error
      if (my.error) {
        this.logService.error('Error retrieving report templates.', reportTemplatesState);
        this.toastrService.showToaster('danger', 'Error retrieving report templates.');
  }
});


//我需要将以下样式应用于component方法中的此toastrService元素

my.component.css

.toastSticky{
  position: -webkit-sticky; /* Safari */
  position: sticky;
  top: 0;
}

最佳答案

您可以使用documentation来执行此操作:

MatSnackBarConfig
Configuration used when opening a snack-bar.

    panelClass: string | string[]                    Extra CSS classes to be
                                                     added to the snack bar container.

10-07 18:07