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(); }; });