javascript - AngularJS 将变量从 html 传递到 href 上的 Controller

Question

我了解基本的 Angular ，并且我正在开发一个项目，其中我有此代码

<div>
    <a href="#!/views/products?productId=98" target="_blank">
        <img src="images/x-{{product.productId}}.png"/>
    </a>
</div>

现在，我将 productId 作为硬编码值。我希望这个productId实际上是product.productId，并且在 Controller 中，我可以在单击它时使用这个productId来获取更多详细信息。

这是我的ProductController

.controller('ProductCtrl',function($scope, $http) {
      $http.get('http://localhost:8080/api/products').

        success(function(data) {
              $scope.product = data;
        });
})

我希望http://localhost:8080/api/products将queryParameter传递为http://localhost:8080/api/products ?id=XX 其中 id 是我上面放置的 html 中的 product.productId 。

我怎样才能做到这一点。

Answer 1

<div>
    <a href="#" ng-click="getMoreDetails(product.productId)" target="_blank">
        <img src="images/x-{{product.productId}}.png"/>
    </a>
</div>

.controller('ProductCtrl',function($scope, $http) {
   $scope.getMoreDetails = function(id){
      $http.get('http://localhost:8080/api/products' + id).

        success(function(data) {
              $scope.product = data;
        });
})

也许只使用对话框或灯箱