Question

我在使用routeParams为我的网站工作时遇到了一些困难。我正在尝试显示一个显示的组列表，可以选择一个组并将其路由到具有该组特定详细信息的页面。我昨天问了一个类似的问题但是我觉得我不知道要问什么。我现在设置的方式我只看到了＆＃39; /＃/的ViewGroup /：ID＆＃39; 在浏览器中而不是实际的ID号，页面是空白的。谢谢你的帮助！

途径：

 .whenAuthenticated('/viewgroup/:id', {
    templateUrl: 'views/groups/groupDetail.html',
    controller: 'GroupCtrl'
  })

INDEX.HTML：

<div class="col-md-4" ng-repeat="group in data.groups | filter: filterObject | filter: search">
<div class="panel panel-default">
  <div class="panel-heading">
    <h5 class="panel-title"><a href="#viewgroup/:id">{{group.name}}</a></h5>
  </div>

GROUPDETAIL.HTML：

<div ng-show="group in data.groups">
 <ol class="breadcrumb">
    <li><a href="#">Home</a></li>
    <li><a href="#">Groups</a></li>
    <li class="active">{{group.name}}</li>
 </ol>

GROUPCTRL：我只使用＆＃39; groups / data.json＆＃39;因为我不知道如何从firebase服务器中提取这些数据。从服务器拉出真的是我需要的。

creativeBillingApp.controller('GroupCtrl', ['$scope', 'groupsService', '$routeParams',  function( $scope, groupsService, $firebase, $routeParams, $http) {

$http.get('groups/data.json').success(function(data){
    angular.forEach(data, function(item) {
      if (item.id == $routeParams.groupId) 
        $scope.group = item;
    });
});

Answer 1

:id语法仅用于routeProvider，以指示它应在URL中查找id值的位置。在视图中，您使用普通的{{}}或ng-bind表示法将id值注入生成的HTML中。

假设您的groups是某个$firebase(ref).$asArray()的结果，您可以使用$id访问每个项目的ID值。

因此，您现在在index.html中拥有<a href="#viewgroup/:id">，只需添加<a href="#viewgroup/{{group.$id}}">即可。 Angular会在呈现模板时将其替换为组ID。

使用routeProvider时，组ID不会以HTML格式显示

1 个答案: