angularjs - Angular 更新和清除工厂变量

标签 angularjs angularjs-scope angular-routing angular-services

我正在创建一个单页应用程序,用户在其中搜索术语,结果保存在变量中,并路由一个显示结果的新页面。我可以使用此功能,但是我希望当用户返回到上一页时,最重要的是当用户注销时清除该变量。执行此操作的正确方法是什么?我希望工厂保存我想要的某些页面的内容,并清除我不想要的某些页面的内容,例如“主页”或“注销”。

工厂:

angular.module('firstApp')
    .factory('fact', function () {
    var service = {};
    var _information = 'Default Info';

    service.setInformation = function(info){
      _information = info;
    }

    service.getInformation = function(){
      return _information;
    }
    return service;
});

Controller :

angular.module('firstApp')
    .controller('InformationCtrl', function($scope, $http, $location, fact) {
        $scope.message = 'Hello';
        $scope.result = fact.getInformation();
        $scope.sub = function(form) {
            console.log($scope.name);
            $scope.submitted = true;
            $http.get('/wiki', {
                params: {
                    name: $scope.name,
                }
            }).success(function(result) {
                console.log("success!");
                $scope.result = result;
                    fact.setInformation(result);
                $location.path('/informationdisplay');
            });;
        }
    });

路线

angular.module('firstApp')
  .config(function ($routeProvider) {
    $routeProvider
      .when('/information', {
        templateUrl: 'app/information/input.html',
        controller: 'InformationCtrl',
        authenticate : true
      })
        .when('/informationdisplay', {
        templateUrl: 'app/information/results.html',
        controller: 'InformationCtrl',
        authenticate : true
      });
  });

输入.html

<div class="row">
    <div class="col-md-6 col-md-offset-3 text-center">
         <p>{{result}}</p>
         <form class="form" name="form" ng-submit="sub(form)" novalidate>
            <input type="text" name="name" placeholder="Name" class="form-control" ng-model="name">
            </br>
            <button class="btn btn-success" type="submit" class="btn btn-info">Check</button>
    </div>
</div>

结果.html

<div ng-include="'components/navbar/navbar.html'"></div>
<div class="row">
    <div class="col-sm-4 col-sm-offset-4">
            <h2>Information Results</h2>
            <p>{{result}}</p>   
    </div>
  </div>
</div>

最佳答案

如果您希望它在更改路线时删除该值(我认为注销也应该更改路线),您可以观看 $routeChangeStart 事件并让它在发生时删除该值。您将该函数放入 module.run block 中:

app.run(function ($rootScope, fact) { 
    $rootScope.$on("$routeChangeStart",function(event, next, current){
        fact.setInformation(null);
    });
});

关于angularjs - Angular 更新和清除工厂变量,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/30341037/

相关文章:

javascript - 无法匹配任何路由 : ""

javascript - Angular 悬停 + 按键事件

css - Less:@import url 在缩小后使用 http 而不是 https

javascript - 重复级联选择选项

javascript - 出厂时的 Angular 访问模块范围

Angular 父子模块 block 大小问题

node.js - @angular/router 未正确安装

javascript - 如何测试 Angular Directive(指令)范围

javascript - Angular js ng-class错误条件在ng-repeat中不起作用

javascript - 如何在 AngularJS 中加载 View 变量之前检测浏览器返回?