Message doesn't fully disappear

[unoriginalscreenname]

Hey, great little service! I did notice that the message continues to take up space in the dom after it is 'closed'. This seems to be because inside the directive you are leaving the message object on the scope instead of clearing it out.

If you add $scope.flash = {} to the flash-directive on line 26 it'll fix it.

            $scope.hide = function () {
                removeAlertClasses();
                if (!isBlank(attr.activeClass)) {
                    element.removeClass(attr.activeClass);
                }
                $scope.flash = {};
            };

[lubosdz]

Yes, this is true, there is a bug and the solution above will fix it. Unfortunatelly, if there is a close-button <button ....>

<div flash-alert active-class="in" duration="0">
     <button type="button" class="close" ng-click="hide()">&times;</button>
     <span class="alert-message">{{flash.message}}</span>
</div>

then button won't disappear too :-)

[wmluke]

Hi @ericmcgregor,

Have you tried out https://github.com/wmluke/angular-flash#styling-considerations to resolve the visibility issues?

Thanks, Luke

[lubosdz]

I was trying to use styling considerations with "alert in" classes, but did not work for me. Or I missed something perhaps... Actually, in the examples, there is no hiding CSS styling (something like alert .close {display: none} or similar) - so I'd say it's either incomplete or not really functional.

[leoetlino]

It doesn't really work, indeed. The dismissed alert still takes up place for an unknown reason; the classes seem correct though.

[caiges]

@ericmcgregor You could also set the display CSS property on the flash message container to "none" and then set the "active class" ("in" by default) display property to "block", "inline", etc.. Then you wouldn't have to add code to clear flash.message.

[fernandomantoan]

Same behavior here, @ericmcgregor solution works for me!

[tobidelius]

same here