AngularJS将变量从html传递到href上的控制器

时间:2016-07-27 23:21:22

标签: javascript angularjs html5

我知道基本的角度,我正在研究一个我有这个代码的项目

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

现在,我将productId作为硬编码值。我希望这个productId实际上是product.productId而在控制器中,我可以在点击它以获取更多细节时使用此productId

这是我的ProductController

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

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

我希望http://localhost:8080/api/productsqueryParameter作为http://localhost:8080/api/products?id=XX传递给product.productId,其中id为{{1}}来自上面的html。

我怎样才能避免这种情况。

1 个答案:

答案 0 :(得分: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;
        });
})

也许只是使用对话框或灯箱