如何从angularJS模板调用encodeURIComponent？

Question

我的角JS模板中有一个块

<a href="#/foos/{{foo.id}}">{{foo.name}}</a>

但是，foo.id属性有时可以包含时髦字符（’/’）。我想做这样的事情：

<a href="#/foos/{{encodeURIComponent(foo.id)}}">{{foo.name}}</a>

但这行不通吗？我怎样才能解决这个问题？

Answer 1

您可以创建一个过滤器来调用 encodeURIComponent

例如

var app = angular.module('app', []);
app.filter('encodeURIComponent', function() {
    return window.encodeURIComponent;
});

然后做

<a href="#/foos/{{foo.id | encodeURIComponent}}">{{foo.name}}</a>

运行示例：http：//jsfiddle.net/YApdK/