Javascript Angularjs-ng内视图ng重复

我有一份产品清单。对于每一个，我都有按钮在这个ng视图中显示关于它的详细信息和注释

例如，用户必须在一个pege中查看所有可用产品的详细信息

以下是HTML列表：

<div ng-controller="ProductsApp">
    <ul>
      <li ng-repeat="product in products">
        <p>{{product.Name}}</p>
        <p>
            <a href="#/details/{{product.Id}}">Details</a>
            <a href="#/comments/{{product.Id}}">Comments</a>
        </p>
        <div ng-view="productView{{product.Id}}">
        </div>
      </li>
    </ul>
</div>

我的控制器：

function DetailsCtrl ($scope, $window, $http, DetailsList) {    
    var productId = $routeParams.productId;
    $scope.Details[productId] = DetailsList.get({'productId' : productId});
}

最后是Details.html

<div>
    Name: {{Details[productId].Name}}
    Size: {{Details[productId].Size}}
    ...
</div>

名称：{{Details[productId].Name}
大小：{{Details[productId].Size}
...

有两个问题：

这是正确的方法吗？还有别的办法吗

如何获取实际ng视图的productId？名称：{{Details[productId].Name}

---

谢谢你

也许有一种方法可以让它按照您正在尝试的方式工作，但我认为这是一种比您需要的更复杂的方法。Angular似乎真的希望每个控制器一次只能有一条路由，而解决这一问题可能会涉及一些黑客行为

相反，请查看首页上的选项卡示例。我会用指令来处理这件事，尽管你可以不用它。类似这样的内容（即兴，因此可能还没有完全按照书面形式进行）：

详细信息
评论
详情请看这里。
这里有评论。

如果您有需要控制器的详细信息和注释的行为，那么我将使用指令。为每一个（每个都有自己的控制器）编写一个指令，然后上面的内容就变成了：

<span ng-click='showDetails[$index] = true'>Details</span>
<span ng-click='showDetails[$index] = false'>Comments</span>

<details ng-show='showDetails[$index]'> data-id='{{product.id}}'></details>
<comments ng-show='!showDetails[$index]'> data-id='{{product.id}}'></comments>

详细信息
评论
数据id='{product.id}}'>
数据id='{product.id}}'>

谢谢！我将尝试使用指令方法。但是，如果我让所有数据（产品列表和详细信息等）只包含在一个控制器中，这会对浏览器造成影响吗？这是一个你想要优化的问题，真的。你没有详细说明“产品”是如何被拆下的，或者它的结构是什么。如果您愿意，这可能只是一个名称和ID的列表，详细信息和注释控制器可以进行自己的API调用（通过$resource）来获取其余内容。不过，这是平常的事。如果他们在初始加载时这样做，那么您并没有减少数据量。如果他们按需执行，则有可能出现渲染延迟。只有你知道哪个对你更重要。麦克罗恩，你能帮我解决这个问题吗？谢谢

<span ng-click='showDetails[$index] = true'>Details</span>
<span ng-click='showDetails[$index] = false'>Comments</span>

<div ng-show='showDetails[$index]'>Details here.</div>
<div ng-show='!showDetails[$index]'>Comments here.</div>

<span ng-click='showDetails[$index] = true'>Details</span>
<span ng-click='showDetails[$index] = false'>Comments</span>

<details ng-show='showDetails[$index]'> data-id='{{product.id}}'></details>
<comments ng-show='!showDetails[$index]'> data-id='{{product.id}}'></comments>