Sid
Sid

Reputation: 5833

making angular service work properly

Following this reference, I am trying to make a new service in angular which serves to show a message on user actions like add, edit, update, delete. What I have done currently is,

meanApp.factory("flash", function($rootScope) {
  var queue = [], currentMessage = '';

  $rootScope.$on('$locationChangeSuccess', function() {
    if (queue.length > 0) 
      currentMessage = queue.shift();
    else
      currentMessage = '';
  });

  return {
    set: function(message) {
      queue.push(message);
    },
    get: function(message) {
      return currentMessage;
    }
  };
});

This is a part of code which I want to inject in other controller in order to get the message when user do basic CRUD in the system. I have postController where I am trying to inject this flash service like.

//considering this example which handles the delete operating
//delete post
meanApp.controller('postDeleteController', function($stateParams, $scope, $http, $location, $state) {
    $http.delete('/api/posts/' + $stateParams.id).success(function(response) {
        $location.path('/blog/list');
        //refresh();
    });
});

Now I want to inject that flash service in this controller and want to show some message like post deleted successfully type of message in bootstrap alert once user delete the post. What else do I need to add in order to get the message to be shown in my view. I am using below code in my common layout to show the message

 <div class="alert" ng-show="flash.get().length">
            <b>
                Alert!
            </b>
            <br/>
            {{flash.get()}}
        </div>

Upvotes: 0

Views: 29

Answers (1)

pritesh
pritesh

Reputation: 2192

You can inject the flash service you have created as..

meanApp.controller('postDeleteController', function($stateParams, $scope, $http, $location, $state, flash) {

And I am not sure about can you use flash in your template file directly..So for this to work another way will be to assign value to a variable in the controller an then use in template as..

meanApp.controller('postDeleteController', function($stateParams, $scope, $http, $location, $state, flash) {
$http.delete('/api/posts/' + $stateParams.id).success(function(response) {
    $location.path('/blog/list');
    $scope.value = flash.get();
    //refresh();
});

});

And in the template file you can use as..

 <div class="alert" ng-show="value.length">
        <b>
            Alert!
        </b>
        <br/>
        {{value}}
    </div>

Upvotes: 1

Related Questions