ページの読み込み時に実行され、送信ボタンの値と状態を変更する次のコントローラーがあります。完全な例はここで見ることができ、この質問に基づいています。
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)"/>
ユーザーがページでフォームを正常に送信すると、ユーザーはサーバーによって別のページにリダイレクトされます。ユーザーがすぐに履歴の戻るボタンを使用してページに再入力すると、コントローラーは入力されなくなります。上記のコントローラーがスコープ変数の読み込みを true に変更し、ユーザーが戻った場合、値「読み込み中」を示すボタンが表示されるため、これは問題です。
コントローラーがヒストリ バックで入力される場合、読み込み変数は false に設定され、ボタンには初期の正しい値が表示されます。
偶然、jquery アドレス プラグイン( bin コードの貼り付け) を含めると (含めるだけで、メソッド呼び出しはありません..!) 、コントローラーが履歴に入力され、読み込み変数が false に設定され、送信ボタンが表示されることがわかりました。読み込み中の値ではなく、正しい値です。したがって、アドレスプラグインが何らかのイベントをトリガーし、それが角度コントローラーをトリガーするように見えます。アドレス プラグインはもう必要ないので、削除したいと思います。特に、何が起こっているのかを理解したいと思っています。
私の質問は次のとおりです。ユーザーがブラウザーの履歴戻るボタンを使用してページに入った場合、コントローラーに再入力するようにどのように指示できますか!?
更新:この問題は、OSX の Safari でのみ発生します。Chrome を使用すると、コントローラも履歴に戻されますが、これは予想される動作です。Thom Porter によるセットアップ例を参照してください: http://so.thomporter.com/force-angular-to-re-enter-controller-on-history-back/