在AngularJS应用中，把URL传递给$routeParam

在Angular 1.2中使用$routeProvider，你可以通过在模式中添加星号来传入位于路径末尾的url。不管你是否URLComponentEncode url，下面的代码都可以工作。

的路线:

angular.module('angularApp', ['ngRoute'])
      .when('/frame/:picture_url*', {
        templateUrl: 'views/frame.html',
        controller: 'PictureFrame'
      });

控制器:

      .controller('PictureFrame', function($scope, $routeParams, $sce){
        //whitelist the URL
        $scope.picture_url = $sce.trustAsResourceUrl($routeParams.picture_url);
      });

然后在你的模板中:

<iframe ng-src="{{picture_url}}"></iframe>

好的，我已经设法找到了一个解决方案与当前稳定版本(@1.0.7)工作。

当前处理此问题的方法将涉及到与$route相关的事件，动态解析与angular不兼容的url，并通过一个额外的服务处理它们，其工作方式与$http拦截类似。

您可以在这里看到工作代码示例:http://embed.plnkr.co/fIA2xj/preview

1. 像往常一样传递一个与angular不兼容的url。访问site.com/url/http://site.com
2. 监听$routeChangeStart事件并提取以/url/
开头的路径的正确url参数
3. 将正确的url参数编码为与angular兼容的形式(在本例中，我使用base64)。不要使用encodeuriccomponent，因为angular会像对待其他url
一样对待它。
4. 用您的业务逻辑重定向到另一个路由，例如:site.com/parsed-url/BASE64_GOES_HERE
5. 解码控制器中的URL并像往常一样使用:)

像往常一样创建angular app模块

angular.module('routes',[]).config([
  '$routeProvider',
  function($routeProvider){
    $routeProvider
      .when('/test', {templateUrl: 'test.html'})
      // This one is important:
      // We define a route that will be used internally and handle 
      // parameters with urls parsed by us via the URLInterceptor service 
      .when('/parsed-url/:url', {templateUrl: 'url.html', controller:'URLCtrl'})
      .when('/', {redirectTo: '/test'})
      .otherwise({templateUrl: '404.html'});
  }
])

URL拦截器服务(singleton)

.service('URLInterceptor', function($rootScope, $location){
  // We listen to $routeChangeStart event and intercept it if 
  // the path matches our url scheme. In this case, every route
  // beginning with /url/ will be caught
  $rootScope.$on('$routeChangeStart', function(e, next, current){
    // $location.path does change BEFORE actual routing happens,
    // so in this case we get parsed new location object
    // for free.
    // To be hones, a better way of handling this case might be using 
    // $locationChangeStart event instead, but it would require us to parse urls 
    // manually.
    var path = $location.path();
    // check if string begins with '/url/'
    var matcher = path.slice(0,5);
    var cleanPath = '';
    if (matcher === '/url/'){
      // Yes it does, yay!
      // Remove leading '/url/' to extract the actual parameter
      cleanPath = path.slice(5);
      // Encode our url to a safe version. We know that encodeURIComponent won't 
      // work either, so a good choice might be base64.
      // I'm using https://code.google.com/p/javascriptbase64/downloads
      $location.path('/parsed-url/' + Base64.encode(cleanPath));
      // Prevent default event execution. Note that, it won't cancel related $location Events
      e.preventDefault();
    }
  });
  return {
    decode: Base64.decode,
    encode: Base64.encode
  }
})

// Main application controller
// We instantiate our URLInterceptor service here
.controller('AppCtrl',function($scope, $location, URLInterceptor){
  $scope.navigateTo = function (path) {
    $location.path('/url/' + path);
  }
})
.controller('URLCtrl', function($scope, $routeParams, URLInterceptor){
  $scope.url = URLInterceptor.decode($routeParams.url);
});

你应该记住两件事:

1. 虽然我试图创建一个尽可能干净的解决方案，通常以这种方式传递数据到angular不被认为是一个好的做法，所以尽量不要使用它，除非你真的需要。
2. 你可以只用一条路由来处理这个问题。我只是觉得这样更干净。

我有一个解决方案，但我不知道它是否会帮助你。从Angular文档http://docs.angularjs.org/api/ng.$location $location有一个函数search(search, paramValue)

传递参数:

parameter = encodeURIComponent url
$location.search({ yourURLParameter: parameter }).path('/preview')

读取参数:

url = decodeURIComponent $location.search().yourURLParameter

当然你需要注入$location dependency

我将搜索参数与路由混合。你的搜索需要在你的路线之前。特别是对于旧的浏览器。如果不是url/?search/#/hash，我认为ie7会爆炸

试试这个格式:

domain.com/?my=params&another=param/#/my/hashes