как сделать тостр в угловых? - PullRequest
Новая
       24

как сделать тостр в угловых?

1 голос
/ 10 марта 2019

Как импортировать toastr в угловое приложение?

Я следую курсу Angular Fundamentals и пытаюсь просто отобразить toastr.успех изнутри моего export class: 

handleThumbnailClick(eventName){
    toastr.success(eventName)
}

и получение следующей ошибки:

enter image description here

Полный ts файл: 

import { Component, OnInit } from '@angular/core'
import { EventService } from './shared/event.service'

declare let toastr

@Component({
    selector: 'events-list',
    template: `<div>
                    <h1>upcoming angular components</h1>
                    <hr>
                    <div class="row">
                        <div class="col-md-5" *ngFor="let event of events">
                            <event-thumbnail (click)="handleThumbnailClick(event.name)" [event]="event"></event-thumbnail>
                        </div>
                </div>

</div>`})
export class EventsListComponent implements OnInit   {
    events:any[]
    constructor(private eventService: EventService) {
    }

    ngOnInit() {
        this.events = this.eventService.getEvents()
    }

    handleThumbnailClick(eventName){
        toastr.success(eventName)
    }
}

Я запустил это, чтобы установить toastr:

npm install toastr --save

И включил их в файл angular.json:

enter image description here

Что я делаю не так?Почему тостер не рендер?

1 Ответ

2 голосов
/ 10 марта 2019

Используйте это заявление на импорт 

import * as toastr from 'toastr';

вместо 

declare let toastr

и ваш angular.json, должно быть так 

        "styles": [
          "src/styles.css",
          "../node_modules/toastr/build/toastr.min.css"
        ],
        "scripts": [
          "../node_modules/toastr/build/toastr.min.js"
        ]
...