Question

我有一个产品列表，动态添加到HTML中。当用户点击产品时，必须将其添加到购物车（请注意，jQueryUI shopping cart example）。

HTML ：从此动态列表中，如何检索单击的产品并将其插入JSON对象？

<li ng-model="selectProduct" ng-click="addProduct()" ng-repeat="product in Products">
  {{product}}
</li>

脚本

$scope.addProduct = function () {
    $scope.myProducts.push($scope.selectProduct); // add text of the selected product
};

$scope.myObject = {
   myProducts: []
};

在jQuery中它会像

$("p").click(functions (){
  var aa = $(this).text()
  myObject = {
    'selectProduct': aa
  };
});

Answer 1

您可以将其作为参数传递，因此它可以像这样工作

HTML：

<li ng-click="addProduct(product)" ng-repeat="product in Products">
  {{product}}
</li>

控制器：

$scope.Products = ["One","Two","Three","Four"]
$scope.myObject = {
   myProducts: []
};

$scope.addProduct = function (thisProduct) {
    $scope.myObject.myProducts.push(thisProduct);
};

一个工作示例位于http://jsfiddle.net/trMKQ/（点击要查看的产品名称）。

Answer 2

作为@mikel答案的替代方案，您实际上可以直接访问该模型。

所以你的HTML代码就是;

<li ng-click="addProduct()" ng-repeat="product in Products">
  {{product}}
</li>

你的角点击方法就是;

$scope.addProduct = function(){
    var selectedProduct = this.product; // where product = product in Products.
};

如果您将repeat指令更改为item in Products，则匹配的js将为this.item;

Answer 3

您必须使用'data'属性来指示点击的产品：

$('.product').click(function() {
    $(this).data('clicked', '1');
});

以角度插入DIV文本

3 个答案: