QAチームからリクエストがありましたが、ばかげていると思います。角度ベースのアプリですでに「about」状態/ページが表示されていて、トップメニューから「about」状態のURLをもう一度クリックすると、「about」ページを再読み込みするとします。 about
ページはどこからでもデータをフェッチしません。ちなみに、リロードは単にまばたきに相当します。
私のangularアプリの状態設定は次のようになります:
_.state('about', {
url: '/about',
templateUrl: '/path/to/about.html',
controller: 'aboutCtrl as aboutView'
});
_
そして、トップメニューには、この状態を指すリンクがあります。
_<a ui-sref="about">About</a>
_
私はこれを機能させるために多くのことを試みました:リンクをクリックすると同じ状態のリロードがトリガーされます。
リンクが静的であるため、$state.go('about', {}, {reload: true});
や$state.transitionTo('about', {}, {reload: true});
のようなものは機能しません。
私が現在試みている最後の手段は、_'$stateChangeSuccess'
_イベントをリッスンしてAngular)のrun
フェーズでリロードを操作することですが、私はそれを考えていません_'about'
_リンクをクリックしても、その状態になっているときに状態がまったく変化しないため、機能します。
これを回避する方法はありますか?ありがとう
UIルーターに付属するui-sref-optsというオプション属性があります。私は同じ問題に直面し、それはそれを解決しました。
例:<a ui-sref="home" ui-sref-opts="{reload: true}">Home</a>
ドキュメントのURL: Iルーターのドキュメント
そうです、私は 状態変更イベント を取得することはできません。その機能がいつかそのAPIを介して使用できるようになるまで、そしてもしそうなら、これはこれに対する半ハッキーな解決策です。 ng-click
を活用し、いくつかのばかげたロジックを使用してQAを緩和することができます(あなたの場合)。また、コントローラーの実装がわからないため、この例では、わかりやすくするために$rootScope
の.run
に提案を入れましたが、必要に応じて統合してください。次の例を観察してください...
<a ui-sref="about" ng-click="sillyQA()">About</a>
.run(['$rootScope', '$state', function($rootScope, $state) {
$rootScope.sillyQA = function() {
if($state.current.name === 'about') {
$state.go('about', {}, { reload: true });
}
}
// -- just to see our about => about state 'change'
$rootScope.$on('$stateChangeStart', function(event, toState, toParams, fromState, fromParams){
console.log('toState: ' + toState.name );
console.log('fromState: ' + (fromState.name || 'Just got there! click again!'));
})
}]);
JSFiddle Link -デモ