programing

AngularJS : 어플리케이션의 모든 루트에 대해1개의 해상도를 사용하는 방법

closeapi 2023. 3. 17. 21:30
반응형

AngularJS : 어플리케이션의 모든 루트에 대해1개의 해상도를 사용하는 방법

저는 제 어플리케이션의 모든 페이지에 대해 현재 사용자를 로드하는 약속을 해결하고 싶습니다.현재, 나는 각오를 반복하고 있다.$routeProvider.when()내 경로 중 하나야.

  $routeProvider.when('/users/edit/:userId', {
  templateUrl: 'app/app/assets/partials/user-edit.html', 
  controller: 'UserEditController',
  resolve:{  
    'currentUser':function( UserService){            
        return UserService.getCurrentUser();
      }
  }
  });  

  $routeProvider.when('/staff_profil/edit', {
  templateUrl: 'app/app/assets/partials/profil-edit.html', 
  controller: 'ProfilEditController',
  resolve:{  
    'currentUser':function( UserService){            
        return UserService.getCurrentUser();
      }
  }
 });

모든 루트에 대해 반복 없이 현재 사용자를 해결하는 것이 목표입니다.

완성도를 높이기 위해 밑줄 대신 '언제' 체인 가능한 앵귤러를 사용한 솔루션 전체를 다음에 나타냅니다.이 코드에는 새로운 것이 없습니다. 단지 위의 답들을 조합했을 뿐입니다.

var originalWhen = $routeProvider.when;

    $routeProvider.when = function(path, route) {
        route.resolve || (route.resolve = {});
        angular.extend(route.resolve, {
            CurrentUser : function(User) {
                return User.current();
            }
        });

        return originalWhen.call($routeProvider, path, route);
    };

위의 메서드가 독자적인 실장으로 되어 있는 경우는, 항상 기존의 것을 랩 할 수 있습니다.

var myModule = angular.module('myModule', ['ngRoute'])
   .config(['$routeProvider', function($routeProvider){

      var originalWhen = $routeProvider.when;

      $routeProvider.when = function(path, route){

         route.resolve = {
            'currentUser':function( UserService){            
              return UserService.getCurrentUser();
            }
         };

         return originalWhen(path, route);
      };   

   }]);

에러 체크를 추가하고, 기존의 resolve 속성을 덮어쓰는 대신에 언더스코어 메서드와 같은 것을 사용하는 것이 좋습니다만, 적어도 이렇게 하면, 모든 루트가 필요한 것을 얻을 수 있습니다.

이것을 헬퍼 방법으로 정리하는 것도 간단합니다.

@Josh 답변은 정답입니다.단, 오리지널을 호출해야 합니다.기능이 다른 경우:

originalWhen.call($routeProvider, path, route);

@N13과 저는 모두 @Josh의 솔루션을 사용할 수 없었습니다.하지만 이건 내게 효과가 있었어

    module.config(['$routeProvider', function($routeProvider){
        $routeProvider.accessWhen = function(path, route){
            route.resolve || (route.resolve = {});
            route.resolve.language = "something"
            return $routeProvider.when(path, route);
        };
    }]);

사용처:

$routeProvider
        .accessWhen('/login', {
           ...
        });

나는 이 사건이 훨씬 낫다는 것을 알았다.

angular.extend({}, $routeProvider, {
  when: function(path, route) {
    route.resolve || (route.resolve = {});
    route.resolve = angular.merge({}, route.resolve, {
      chef: 'OrganizationCheckerProvider'
    });
    return $routeProvider.when(path, route);
  }
});

오래된 코드 베이스에 갇힌 사람들을 위해.

const _when = $routeProvider.when;
$routeProvider.when = (path, route) => _when.call($routeProvider, path, {
  ...route,
  resolve: {
    ...route.resolve,
    'currentUser': [ 'UserService', UserService => UserService.getCurrentUser() ]
  }
});

모든 답을 조합하다

var myModule = angular.module('myModule', ['ngRoute'])
        .config(['$routeProvider', function ($routeProvider) {
            var originalWhen = $routeProvider.when;

            $routeProvider.when = function (path, route) {
                route.resolve || (route.resolve = {});
                angular.extend(route.resolve, {
                    CurrentUser: ['User', function (User) {
                        return User.current();
                    }]
                });
                return originalWhen.call($routeProvider, path, route);
            };
        }]);

언급URL : https://stackoverflow.com/questions/19937751/angularjs-how-to-use-one-resolve-for-all-the-routes-of-my-application

반응형