如何在删除AngularJS中的项目后重新加载状态?

时间:2016-09-17 12:46:44

标签: javascript angularjs html5

在我点击删除按钮的项目中,我正在调用一个函数,在里面调用带有delete方法的api。从项目列表中成功删除项目后,我正在重新加载状态。这里的问题是,我在URL中传递项目ID。所以在删除项目之后,项目ID仍然存在于url中,因为为什么在状态重新加载已经删除的项目ID已经在url中重新加载,其中没有值。

下面给出了更好地理解代码的代码。

survey.html

   <ul class="sidebar-nav">
            <li class="sidebar-brand" >
                <a>
                    Projects
                </a>
            </li>
            <li ng-repeat="obj in allProjects track by  $id(obj)">
                <a ui-sref="survey.surveyList({id: obj.ProjectID})" ng-click="getProjSurveys(obj.ProjectID)" ui-sref-active="activeProject" ng-init="getReloadProjSurveys()">{{obj.ProjectName}}<span class="projectsetting" ng-click="sendProjectID(obj.ProjectID)"><img src="./images/settings.png"/></span></a>
            </li>
         </ul>
       <div class="surveyContainer" ui-view></div>

index.js(使用UI路由)

   .state('survey', {
        url: '/survey',
        views:{
            header:{
                templateUrl: 'common/headerTool.html',
                controller: 'headerController'
            },
            pageContent:{
                templateUrl: 'survey/survey.html',
                  controller: 'surveyController'
            },
            footer:{
                templateUrl: 'common/innerFooter.html',
                controller: 'footerController'
            }
        }
    }).state('survey.surveyList', {
        url: '/:id',
        templateUrl: 'survey/surveyList.html',
        controller: ''
    });

popup.html 这是显示删除确认弹出窗口的地方

  <div class="modal fade" id="deleteProject" tabindex="-1" role="dialog" aria-labelledby="myModalLabel">
   <div class="modal-dialog" role="document">
    <div class="modal-content">
     <div class="modal-body">
        <p class="text-center">Are you sure you want to delete this project</p>
     </div>
    <div class="modal-footer">
     <div class="col-md-6 text-right"><span type="button" class="cancel" data-dismiss="modal">Cancel</span></div>
     <div class="col-md-offset-1 col-md-5 text-left"><span type="button" class="success" value="Delete" ng-click="projectDelete()" >Delete</span></div>
    </div> 
  </div>

点击此按钮,调用此控制器内的projectDelete()

surveyController.js

  $scope.sendProjectID = function(ProjectID){
     $scope.ProjectID = ProjectID;
   };
  $scope.projectDelete = function($event){
      $("#deleteProject").hide();
       UserService.DeleteProject($scope.ProjectID).then(
       function( data ) {
          console.log(data);
          state.reload();
         //$state.go('survey.surveyList',{id: 0});
         $("#deleteProject").modal("hide");
      });
   };

我尝试使用state.reload()$state.go('survey.surveyList',{id: 0});。这个$ state.go()的id = 0是我想要重新加载的默认值。

1 个答案:

答案 0 :(得分:1)

你尝试过$state.go('survey.surveyList',{id: 0}, {reload : true});吗?

参考: https://github.com/angular-ui/ui-router/wiki/quick-reference#toparams