Question

我正在尝试使用bootstrap-notify v3.1.3，typescript，aurelia和VS2015在我的网站上显示警报。

我的aurelia组件是：

//myAlert.ts

import * as $ from "jquery";

export class FlAlert {

    constructor() {
    }

    alert() {
        $.notify("Hello");
    }
}

//myAlert.html

<template>
    <button class="btn" click.delegate="alert()">showAlert</button>
</template>

当我点击按钮时，我收到此错误：“未捕获TypeError：$ .notify不是函数”

我在项目bootstrap-notify.d.ts中包含，所以VS从d.ts文件识别“notify”方法

//bootstrap-notify.d.ts

/// <reference path="../jquery/jquery.d.ts" />

/* tslint:disable: interface-name no-any */

interface JQueryStatic {
    notify(message: string): INotifyReturn;
    notify(opts: INotifyOptions, settings?: INotifySettings): INotifyReturn;
    notifyDefaults(settings: INotifySettings): void;
    notifyClose(): void;
    notifyClose(command: string): void;
}

interface INotifyOptions {
    message: string;
    title?: string;
    icon?: string;
    url?: string;
    target?: string;
}

interface INotifySettings {
    element?: string;
    position?: string;
    type?: string;
    allow_dismiss?: boolean;
    allow_duplicates?: boolean;
    newest_on_top?: boolean;
    showProgressbar?: boolean;
    placement?: {
        from?: string;
        align?: string;
    };
    offset?: number;
    spacing?: number;
    z_index?: number;
    delay?: number;
    timer?: number;
    url_target?: string;
    mouse_over?: Function;
    animate?: {
        enter?: string;
        exit?: string;
    };
    onShow?: () => void;
    onShown?: () => void;
    onClose?: () => void;
    onClosed?: () => void;
    icon_type?: string;
    template?: string;
}

interface INotifyReturn {
    $ele: JQueryStatic;
    close: () => void;
    update: (command: string, update: any) => void;
}

修改

这是Aurelia app的切入点：

export function configure(aurelia: Aurelia) {

    aurelia.use
        .singleton(Constants)
        .plugin("bootstrap", null)
        .standardConfiguration()
        .developmentLogging();

    aurelia
        .start()
        .then(a => a.setRoot('Components/Layout/app'));
}

Answer 1

我已经晚了三年，但今天我遇到了同样的问题，只需在组件中添加import 'bootstrap-notify';即可解决此问题。

$ .notify不是在typescript中使用Bootstrap notify的函数

1 个答案: