html - 如何使用 AngularJs 将参数从 URL 注入(inject) HTML

Question

我正在构建一个应用程序(使用 Express、Node 和 Angular)来存储客户端并能够查看他们的信息。每个客户端都分配有一个 id key 。我创建了一个链接，当单击客户名称时，它会转到如下所示的网址:client/{{client.id}} 。我想提取这个参数 id，这样我就可以过滤客户端并仅显示具有该 id 的客户端。这是我的express.js，我在其中找到参数id并将其打印在控制台中:

// express stuff
app.param('id', function (req, res, next, id) {
console.log(req.params.id);
next();
});
app.get('/client/:id', routes.clientpage);

现在，我看到控制台日志中打印了 id ——但是，使用 Angular，我如何将此参数注入(inject)到过滤器中？这就是我的想法，但我显然错了:

<ng-repeat="client in clients | orderBy:'id' | filter:{id:{{$req.params.id}}} | limitTo: 1"/>

Answer 1

你可以通过一些 url 解析表达式来做到这一点，如下所示:

//in controller
$scope.clientId = document.location.href.split('client/')[1];

//in template
<ng-repeat="client in clients | orderBy:'id' | filter:{id:clientId} | limitTo: 1"/>

这适用于 myapp.com/example/client/46235 等网址，但对于 myapp.com/example/client/46235/getsmth 可能会失败，因此您可能需要使用其他解决方案:

• angular UI router用于客户端应用程序导航
• 在服务器生成的模板的某些部分输出此 ID。