javascript - AngularJS Toastr:在右下 Angular 显示 toast

我是使用toastr的新手。我的问题是如何覆盖positionClass并在右下方显示吐司。

我知道您可以使用options在html中执行此操作，但是我不希望在html中执行此操作。我需要管理20个页面。为每个页面添加都不合适。因此，我将烤面包片用作service，并且可以在每个粗粒面包的控制器中使用它。

     (function() {
        "use strict";

        angular.module("app").factory('ToastService', function($mdToast, toastr) {


            //http://codeseven.github.io/toastr/demo.html
            toastr.options = {
                "closeButton": false,
                "debug": false,
                "newestOnTop": false,
                "progressBar": false,
                "positionClass": "toast-bottom-right",
                "preventDuplicates": false,
                "onclick": null,
                "showDuration": "300",
                "hideDuration": "1000",
                "timeOut": "6000",
                "extendedTimeOut": "1000",
                "showEasing": "swing",
                "hideEasing": "linear",
                "showMethod": "fadeIn",
                "hideMethod": "fadeOut"
            };

      return {

                info: function(content, title) {
                    if (!content) {
                        return false;
                    }

                    return toastr.info(content, title, {
                        timeOut: toastr.options.timeOut
                    });
                },


                success: function(content, title) {
                    if (!content) {
                        return false;
                    }

                    return toastr.success(content, title, { timeOut: toastr.options.timeOut});
                },

        error: function(content, title, time) {
            if (!content) {
                return false;
            }
            return toastr.error(content, title, {
                timeOut: time
            });
            //
        },

        };
    });
})();

在控制器中，我这样称呼它。

  ToastService.error('Connection interrupted!', 'Server Error');

但是，我要在右下角显示它，而不是右上角的默认位置。

谢谢！

最佳答案

通过以下方法设置的选项，toastr从右下角弹出：

config.js（cref：John Papa -Pluralsight）

(function () {
    var app = angular.module('app');
    // Configure Toastr
    toastr.options.timeOut = 4000;
    toastr.options.positionClass = 'toast-bottom-right';
    toastr.options.showMethod = 'slideDown';
    toastr.options.hideMethod = 'slideUp';
    var config = {
        version: '1.1.0',
        ...
    };
    app.value('config', config);
})();

您能解决CSS问题吗？