Angular routeProvider和encodeURIComponent

时间:2016-01-08 10:31:39

标签: javascript angularjs route-provider

我只是偶然发现了一个棘手的情况:我使用角度ui网格来显示客户名称列表。 Id列将用作客户端详细信息视图的链接。它包含带有ng-href的<a>标记。

某些客户端名称包含URL中不允许的字符,因此我添加了一个角度过滤器来调用encodeURI组件。这工作正常,但当我点击编码链接 a)firefox浏览器显示没有编码的链接 b)angular routeProvider无法识别URL并且是默认路由。

我的手机模板:

$scope.cellTemplate = function(url) {
var s = '<div class="{{' + isRowInactive() + ' ? \'ui-grid-cell-contents strikethru\' : \'ui-grid-cell-contents\'}}" ng-class="col.colIndex()">' +  '<span >';
if (url) 
   s += '<a ng-href="#/client/{{ row.entity.id | encodeURIComponent }}">';
s += '{{ grid.getCellValue(row, col) }}';
if (url)
   s += '</a>';
s += '</span></div>';
return s;
};

My Angular过滤器:

angular.module('rcoc.filters', [])
.filter('encodeURIComponent', function() {
   return window.encodeURIComponent;
});

我的路线提供者定义(摘录):

app.config(['$routeProvider', function($routeProvider) {
    $routeProvider.
when('/home', { templateUrl: 'partials/home.html', controller: 'HomeCtrl' }).
when('/client/:id', { templateUrl: 'partials/client-detail.html', controller: 'ClientDetailCtrl', title: 'client' }).
otherwise({ redirectTo: '/home' });
}]);

如果客户端名称包含无效的URL字符,Angular总是将我路由到主页,例如“Customer(AMS @ ITM / H)”。 firefox检查员显示编码确实发生了:

<a class=ng-binding ng-href="#/client/Customer%20(AMS%40ITM%2FH)" href="#/client/Customer%20(AMS%40ITM%2FH)">Customer (AMS@ITM/H)</a>

我不明白为什么会这样。

0 个答案:

没有答案