Question

我之前有一个javascript函数onclick =＆＃34; submitDynamicSku（）＆＃34;但我们最近开始转换为Angular以使用控制器构建，我希望能够通过此功能，因为它是我的ng-repeat的一部分。

示例：

onclick="submitDynamicSku('x', document.getElementById('y').value, false, true);"

我想尝试一下：

onclick="submitDynamicSku(product.sku, document.getElementById('{{ product.id').value, false, true);"

当前代码：

  $scope.submitSku = function(sku,id,false,true) {
    submitDynamicSku(sku, document.getElementById(id).value, false, true);

    function submitDynamicSku(sku, cnt, recurringOrder, viewCart) {
    jQuery("#dynamicAsstName").val(""); 
    jQuery("#dynamicSku").val(sku);
    jQuery("#dynamicSkuCount").val(cnt);
    jQuery("#setRecurringOrder").val(recurringOrder);
    jQuery("#viewCart").val(viewCart);
    if (viewCart == false) {
        jQuery("form[name='dynamic_add_to_cart_form']")
            .submit(function() {
                this.action = "";
                return true;
            });
    } 
    jQuery("form[name='dynamic_add_to_cart_form']").submit();       
}   
    }


<%--Angular Block--%>
                <li ng-repeat="product in products">
                    <div class="prod-img ">
                        <img ng-src="{{ product.imagePath }}" alt="{{ product.imageAlt }}" ng-class="{{ product.selector }}" />
                    </div>
                    <div class="prod-info">

                        <h2>{{ product.name}}</h2>
                        <h3>{{ product.price }}</h3> 
                        <p>{{ product.description }}  </p>

                        <a class="fancybox" href="#prodDesc-{{product.id}}">More Information &#187;</a>
                        <div class="prod-cart">
                            <span class="qty-amt">QTY: <input value="1" id="{{ product.id }}"  /> BOX</span>

                            <button href="javascript:void(0);" ng-click="submitSku(product.sku,product.id,false, true)">Add to Cart</button>

                        </div>

                    </div>

                </li>

Answer 1

在控制器内创建如下函数：

$scope.submitDynamicSku = function(pID){
   var elm = document.getElementById(pID);
   ....
}

然后在HTML中使用ng-click :(假设您在产品上使用ng-repeat）

ng-click="submitDynamicSku(product.id)"

Answer 2

假设您已在div

上应用 ng-repeat

<强> HTML：

  json_array = json.dumps(thearray)
  return render(request, "page.html",{

  'thearray': json_array,
   })

 var cities = {{ thearray|safe }};
    console.log(typeof cities); - >

<强>控制器：

   <div ng-repeat="product in products ">
    <button ng-click="submitDynamicSku(product.sku,product.id,false, true)">{{product}}"</button>
    </div>

}]）;

Answer 3

/* Inside the Controller */
$scope.submitSku = function(sku,id) {
    submitDynamicSku(sku, id, false, true);
};

/* HTML */
<a ng-click="submitSku(product.sku, product.id);">...</a>

在角度ng-repeat中使用现有的JS函数

3 个答案: