页面重新加载后显示警报消息

Question

我必须在控制器 2 addData API 调用中调用 $route.reload();，这样我才能在我的 UI 中获取添加的数据。但是由于页面刷新，文本 'Data added successfully' 消失了。

控制器 1:

  $rootScope.$on('reloaded', function(event, data) { 
         $scope.$parent.alerts.length=0;
         $scope.$parent.alerts.push({type: 'success',msg: 'Data added successfully'});
    });

控制器 2:

 $scope.add = function() {
someAPIService.addData(JSON.stringify($scope.rows)).success(function(response) {
            ngDialog.close('ngdialog1');
            $route.reload();
            $rootScope.$emit('reloaded', "true");
        });
}

HTML部分：

<section>
     <div ng-controller="controller3">
     <alert ng-repeat="alert in alerts" type="{{alert.type}}" close="closeAlert($index)">{{alert.msg}}</alert>
     </div>

     <div class="row form-inline" ng-controller="controller2 as vm">
       <!-- Table data with text fields--> 
     </div>

    <script type="text/ng-template" id="addDataDialog">

    <div id="frm" ng-controller="controller1" class="col-xm-6">

    <div class="form-group">
      <!-- Labels with text fields--> 
    </div>

      <button class="ngdialog-button" ng-click="add()">Save</button>
    </div>
    </script>
    </section>

注意： 两个控制器都在同一个 JS 文件中，并且它们用于同一个 HTML 文件。

Answer 1

只是一个简单的答案提示：

在调用重新加载（使用例如 Cookies lib）之前添加一个（特定的）cookie（使用 javascript），
重新加载时阅读，
然后删除

如果可用，您也可以使用 local storage 而不是使用相同步骤的 cookie：

在调用重新加载之前在本地存储中添加特定条目
重新加载时阅读
然后删除

保持客户端状态的另一种选择是使用 url 参数，但这些参数不适用于页面重新加载

Answer 2

因为你只想加载服务器端的最新记录列表。然后在调用 post 后就不需要使用 $route.reload(); 了。您只需拨打 ajax 电话即可获取可解决您问题的最新记录列表。要制作 ajax 你需要参考 $http

$route.reload() is getting used only when you need to load controller again with specified template in your $routeProvider when condition

页面重新加载后显示警报消息

Display alert message after page reload

javascript

angularjs

angularjs-routing