AngularJS toaster close button not visible

Question

I am using AngularJS Toaster in my application for getting dynamic notifications.Present I am getting the notifications but close button is not visible. This is my code

 var message = "Welcome..";
        $scope.popToaster = function(){
            toaster.pop('success', "Alert", message);
}

HTML :

 <toaster-container toaster-options="{'close-button': true}"></toaster-container>

Please suggest if I am doing anything wrong?

Answer 1

As you mentioned that you are using version 0.3 of AngularJS-Toaster I suggest to use the latest version or at least 0.4.7. The close button was added above 0.4.6 as you can see here in the directive template. Another advantage is that you can use functions like success or error on the toaster service itself. Here is a small example:

<div ng-app="myApp">
    <toaster-container toaster-options="{'close-button':true}"></toaster-container>
    <div class="container" ng-controller="myCtrl">
        <button type="button" ng-click="displayToaster()">Toaster</button>
    </div>
</div>

And here is the script file:

var myApp = angular.module("myApp", ["toaster"]);

myApp.controller("myCtrl", function ($scope, $http, toaster) {
    $scope.displayToaster = function () {
        toaster.success("Welcome...");
    };
});

So please use the latest version 0.4.13 from the official git repository .