我有以下控制器在页面加载时执行并更改提交按钮的值和状态。可以看到here的完整示例,它基于this问题。
app.controller('FormSubmitCtrl', function($scope, $rootScope, $timeout) {
$scope.loading = false;
$scope.load = function($event) {
$rootScope.event_target = $event.target;
$scope.loading = true;
$timeout(function() { $scope.loading = false; }, 5000);
}
});
app.directive('disabler', function($compile, $rootScope) {
return {
link: function(scope, elm, attrs) {
//var btnContents = $compile(elm.contents())(scope);
scope.$watch(attrs.ngModel, function(value) {
if (value) {
scope.initial_value = elm.attr('value');
if (elm.attr('name') == $rootScope.event_target.name){
elm.attr('value', scope.$eval(attrs.disabler));
setTimeout(function(){
elm.attr('disabled',true);
}, 0);
}
} else {
//elm.html('').append(btnContents);
if (typeof $rootScope.event_target != "undefined"){
//server did not respond in timeline fashion .. inform user
if (elm.attr('name') == $rootScope.event_target.name){
elm.attr('value', scope.initial_value);
elm.attr('disabled',false);
}
}
}
});
}
}
});
form.html
<input id="submit_item_button" name="form2_submit_btn1" type="submit" value="Go" class="btn" disabler="'Loading..'" ng-model="loading" ng-click="load($event)"/>
如果用户成功在页面上提交表单,则服务器会将用户重定向到另一页面。如果用户现在立即使用历史记录返回按钮重新进入页面,则不再输入控制器。这是一个问题,因为上面的控制器将范围变量loading更改为true,如果用户返回,他仍然会看到显示值“loading”的按钮。
如果控制器将在历史记录中输入,则加载变量将设置为false,按钮将显示初始值和正确值。
我偶然发现当我包含(只包括,没有方法调用它......!)jquery address plugin(paste bin code)控制器在历史记录中输入时,加载变量被设置为false,提交按钮显示正确的值,而不是loading ..值。因此,地址插件似乎会触发某个事件,从而触发角度控制器。由于我不再需要地址插件,我想摆脱它,特别是我想了解发生了什么。
我现在的问题是:如果用户通过浏览器中的历史记录返回按钮进入页面,我怎么能告诉角度重新进入控制器??
更新:我仅在OSX上的Safari中遇到此问题。使用Chrome时,控制器也会在历史记录中输入,这是预期的行为。请参阅Thom Porter的示例设置:http://so.thomporter.com/force-angular-to-re-enter-controller-on-history-back/