Web Programming examples

Google Maps,AngularJS

Ruby on Rails Tutorial flash message to user signup with AngularJS

1)flash message with AngularJS

$ vi app/assets/javascripts/mymodule.js.erb

myModule.factory("flashService", function ($rootScope) {
  var queue = [];
  var currentMessage = "";

  $rootScope.$on("$routeChangeSuccess", function() {
    currentMessage = queue.shift() || "";
  });

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

*routeChangeSuccess
ref.https://docs.angularjs.org/api/ngRoute/service/$route

2)AngularJS controller "UsersNewCtrl"

$ vi app/assets/javascripts/mymodule.js.erb

myModule.controller("UsersNewCtrl", function($scope, userResource, $location, flashService) {
  var msg = "Welcome to the Sample App!";
  $scope.user = new userResource();
  $scope.submit = function() {
    function success(response) {
      flashService.push(msg);
      $location.path("/users/" + response.id);
    }
    function failure(response) {
      console.log("failure", response)
    }
    userResource.create($scope.user, success, failure);
  };
});

3)AngularJS show view

1.show view

$ vi app/assets/templates/users/show.html.erb

<div ng-controller="UsersShowCtrl">
  <div class="row">
    <div class="bg-success" ng-show="getMessage()">
      <p>{{getMessage()}}</p>
    </div>
........

2.AngularJS controller "UsersShowCtrl"

$ vi app/assets/javascripts/mymodule.js.erb

myModule.controller("UsersShowCtrl", function($scope, $routeParams, userResource, flashService) {
  $scope.user = userResource.show({ id: $routeParams.id });
  $scope.getMessage = function() {
    return flashService.get();
  };
});