javascript - Passing object between views (flash message) - Stack Overflow

admin管理员组

文章数量:1198383

What is the best way to pass message in the below scenario.

In the success scenario of $scope.p.$save, the result contains a message (res.message), which I like to display in the next view ($location.path("/test/"+res.reply.Id)). Without AngularJS, I may pass it in the url or save it in session cookies. But, I guess there might be a better way in AngularJS as there is no browser redirect and the state should be available. What is the best way to achieve this?

Setting it in rootScope shows it while I use browser back button, and the scope of the message should only for the first navigation to the new view.

function NewCtrl(Phone, $location, $rootScope, $scope) {
    $scope.p = new Phone();
    $scope.save = function () {
        $scope.p.$save(
            {},
            function (res) {
                $rootScope.message = res.message **//<-- this will cause message still set when using browser back button, etc**
                $location.path("/test/"+res.reply.Id); **//<-- Req: needs to pass the message to next view**
            }, function (res) {
            //TODO
            }
        );
    };
}
....
PhoneApp.factory('Phone', function ($resource) {
    return $resource('/api/test/:_id')
});

What is the best way to pass message in the below scenario.

In the success scenario of $scope.p.$save, the result contains a message (res.message), which I like to display in the next view ($location.path("/test/"+res.reply.Id)). Without AngularJS, I may pass it in the url or save it in session cookies. But, I guess there might be a better way in AngularJS as there is no browser redirect and the state should be available. What is the best way to achieve this?

Setting it in rootScope shows it while I use browser back button, and the scope of the message should only for the first navigation to the new view.

function NewCtrl(Phone, $location, $rootScope, $scope) {
    $scope.p = new Phone();
    $scope.save = function () {
        $scope.p.$save(
            {},
            function (res) {
                $rootScope.message = res.message **//<-- this will cause message still set when using browser back button, etc**
                $location.path("/test/"+res.reply.Id); **//<-- Req: needs to pass the message to next view**
            }, function (res) {
            //TODO
            }
        );
    };
}
....
PhoneApp.factory('Phone', function ($resource) {
    return $resource('/api/test/:_id')
});

• javascript
• angularjs

Share Improve this question Follow edited Dec 14, 2017 at 15:27 Graham 7,8022020 gold badges6464 silver badges9191 bronze badges asked Sep 29, 2012 at 19:13 bsrbsr 58.7k8888 gold badges217217 silver badges321321 bronze badges

Add a comment  | 

3 Answers 3

Sorted by: Reset to default 16

You could use a service which displays the flash on $routeChangeSuccess.

Each time you set a flash message, add it to a queue, and when the route changes take the first item off the queue and set it to the current message.

Here's a demo:

http://plnkr.co/edit/3n8m1X?p=preview

I was looking to implement similar functionality, but actually wanted more of a growl style message.

I've updated the excellent plinkr code that Andy provided above to include a 'pop' method that leverages the toastr growl-style notification library.

My update also lets you to specify the notification type (info, warning, success, error) and title.

The 'pop' method skips adding the message to the queue, and instead pops it up on the screen immediately. The set/get functionality from Andy's previous plinkr remains mostly unchanged.

You can find my update here: http://plnkr.co/edit/MY2SXG?p=preview

I don't believe there's a way to do this default to AngularJS. Your best bet would just be passing the message (encoded) through a query string.

本文标签： javascriptPassing object between views (flash message)Stack Overflow