6

特定のルートが要求されたときに routeProvider からモーダル ダイアログ ウィンドウを開くなど、[機能を実行する] ことは可能ですか?

myApp.config(function($routeProvider) {
    $routeProvider
        .when('/home',
            {
                controller: 'HomeCtrl',
                templateUrl: 'Home/HomeView.html'
            }
        ).when('/profile/:userId/changepwd',
            function(){                
                $dialog.messageBox(title, msg, btns)
                    .open()
                    .then(function(result){
                    alert('dialog closed with result: ' + result);
                });
            }
        ).otherwise({ redirectTo: '/home' });
});

PS:ルートをキャンセルして、代わりにダイアログ ボックスを開きたいです。ダイアログボックスを開くことだけが問題ではありません。ルートのキャンセルは大きな問題です。

4

3 に答える 3

4

関数を依存関係として解決に渡すことができます。依存関係が解決されるまで待機し、ダイアログが終了したら、$locationを使用して必要に応じてルートを変更し、履歴を変更します 

var app = angular.module('myApp', [])
  .config(['$routeProvider', function($routeProvider) {
    $routeProvider.when('/view1', {
       template: '&nbsp',
       controller: //empty function,
       resolve: {
         data1 : function($dialog, $location) {
                     var promise = $dialog.messageBox(title, msg, btns)
                            .open()
                            .then(function(result){
                               alert('dialog closed with result: ' + result);
                               //Use [$location][1] to change the browser history
                            });
                     return promise;
                }
       }
   });
}]);
于 2013-07-23T23:26:30.127 に答える
2

Rishabh の回答に基づいて構築し、この Angular Issueから sergey の location.skipReloadを使用して、次を使用してルート変更に関するダイアログを作成し、URL 変更を無期限に延期し (実質的にルート変更を「キャンセル」)、URL を書き換えることができます。別のリロードを発生させずにバーを「/」に戻します:

//Override normal $location with this version that allows location.skipReload().path(...)
// Be aware that url bar can now get out of sync with what's being displayed, so take care when using skipReload to avoid this.
// From https://github.com/angular/angular.js/issues/1699#issuecomment-22511464
app.factory('location', [
  '$location',
  '$route',
  '$rootScope',
  function ($location, $route, $rootScope) {
    $location.skipReload = function () {
      var lastRoute = $route.current;
      var un = $rootScope.$on('$locationChangeSuccess', function () {
        $route.current = lastRoute;
        un();
      });
      return $location;
    };
    return $location;
  }
]);


app
  .config(['$routeProvider', function ($routeProvider) {
    $routeProvider
      .when('/home', {
        controller: 'HomeCtrl',
        templateUrl: 'Home/HomeView.html'
      })
      .when('/profile/:userId/changepwd', {
        template: ' ',
        controller: '',
        resolve: {
          data1: function($dialog, location, $q){
            $dialog.messageBox(title, msg, btns)
            .open()
            .then(function(result){
                //fires on modal close: rewrite url bar back to '/home'
                location.skipReload().path('/home');

                //Could also rewrite browser history here using location?
              });

            return $q.defer().promise; //Never resolves, so template '&nbsp' and empty controller never actually get used.
          }
        }
      })
      .otherwise({
        redirectTo: '/'
      });

これは、未解決の約束を漏らしているように感じます。もっときちんとした解決策があるかもしれませんが、これは私の目的にはうまくいきました。

于 2013-09-12T14:32:14.143 に答える