重置角度页面

时间:2016-05-05 16:54:01

标签: javascript angularjs angularjs-scope reset

我的角度页面上有一个按钮,我希望能够重置页面。通过重置我的意思是将页面恢复到原始状态,就像用户刚刚第一次访问该页面一样。我正在考虑复制路线,所以我尝试了这样的事情:

$scope.orig = angular.copy($rootScope);

但那扔了this error。我有几个范围变量和许多控制器变量。我不想单独保存它们。我认为将页面复制到其原始状态会更容易,然后通过检索原始版本重置它。但这似乎并不是一个可行的解决方案。任何想法如何解决这个问题?

编辑1: 我试过Ben Felda的解决方案,但无法让它发挥作用。这是我的控制器代码:

var app = angular.module('myApp',['ngRoute']);

var MyCtrl = function($route, $scope, $log, $http, $sce, $q, $filter) {
    this.$route = $route;
    this.$scope = $scope;
    this.$log = $log;
    this.$http = $http;
    this.$sce = $sce;
    this.$q = $q;
    this.$filter = $filter;

    this.ShouldAutoStart = false;
    this.viewA = true;
    this.viewB = false;
    this.topButtonClicked = false;
    this.showIDTable = false;
    this.topRequest;
};

MyCtrl.prototype.reset = function() {
    var _this = this;
    console.log("route reloaded");
    _this.$route.reload();
};

MyCtrl.prototype.getInfo = function() {
    var _this = this;
    _this.reset();
    //do other stuff
};

MyCtrl.$inject = ['$route','$scope', '$log', '$http', '$sce', '$q', '$filter'];
app.controller('MyCtrl', MyCtrl);

这是我的HTML:

<form ng-submit="dp.getInfo(dp.id)" class="form-inline">
    <div class="form-group">
        <div class="input-group">
            <input type="text" ng-model="dp.id" class="form-control" required/>
        </div>
    </div>
    <button type="submit" class="btn btn-primary">Submit</button>
</form>

我在angular-route.js中添加了index.html个文件。知道我做错了吗?

2 个答案:

答案 0 :(得分:5)

尝试使用$route.reload()

Angular API Reference

  

即使$ location未更改,也会导致$ route服务重新加载当前路由。

     

因此,ngView创建新范围并重新实例化   控制器。

答案 1 :(得分:1)

我不确定你发布的其他变量超出了你发布的内容,但是将所有的实例化代码移动到一个单独的方法中,以便你的控制器看起来像这样:

XMLWriter

然后,当您想要重置它时,只需在控制器上调用activate方法。