如何使用注入令牌修复错误TypeError:“ this.toastr未定义”

时间:2019-09-06 20:21:08

标签: html css angular toastr

我想使用Toastr API,但尝试使用它时收到错误消息(“ ERROR TypeError:” this.toastr is undefined“)。我缺少什么?

我尝试放

        DB::select('
            SELECT t1.*
            FROM messages AS t1
            INNER JOIN
            (
                SELECT
                    LEAST(sender_id, recipient_id) AS user_id,
                    GREATEST(sender_id, recipient_id) AS recipient_id,
                    MAX(id) AS max_id
                FROM messages
                GROUP BY
                    LEAST(sender_id, recipient_id),
                    GREATEST(sender_id, recipient_id)
            ) AS t2
                ON LEAST(t1.sender_id, t1.recipient_id) = t2.sender_id AND
                   GREATEST(t1.sender_id, t1.recipient_id) = t2.recipient_id AND
                   t1.id = t2.max_id
                WHERE t1.sender_id = ? OR t1.recipient_id = ?
            ', [auth()->guard('api')->user()->id, auth()->guard('api')->user()->id]);

在index.html文件中,但是我收到了与之不同的错误。 (由于MIME类型(“ text / html”)不匹配(X-Content-Type-Options:nosniff),“ http://localhost:4200/node_modules/toastr/build/toastr.min.css”中的资源被阻止了。)我担心这不是正确的路径。

应用模块

  <link rel = "stylesheet" href = "node_modules/toastr/build/toastr.min.css">
  <script src = "node_modules/jquery/dis/jquery.min.js"></script>
  <script src = "node_modules/toastr/build/toastr.min.js"></script>

页面组件

import { TOASTR_TOKEN, Toastr } from './commons/toastr.service';
let toastr:Toastr = window['toastr'];
providers: [
    ResolveService,
    WebsiteBackendService,
    {
      provide: TOASTR_TOKEN, useValue:toastr
    }
  ],

敬酒服务

constructor(private fb: FormBuilder,private backend:WebsiteBackendService, @Inject(TOASTR_TOKEN)private toastr:Toastr) {
    this.mouseOverSubmit = false;
   }

  ngOnInit() {
  }

  submit() {
    this.toastr.success("Form Submitted!");
    this.backend.submitBlogArticle(this.form.getRawValue()).subscribe((data:any) => {
      //this is where a response would come in
      console.log(data);
    });
    console.log(this.form.getRawValue());
  }

angular.json

import { InjectionToken } from '@angular/core'

export let TOASTR_TOKEN = new InjectionToken<Toastr>("This parameter is just used for debugging : toastr")

export interface Toastr {
    success (msg: string,title?:string): void;
    info (msg: string,title?:string): void;
    warning (msg: string,title?:string): void;
    error (msg: string,title?:string): void;
}

0 个答案:

没有答案