【问题标题】:form name in ng-repeat and pass form name in ng-click function to javascriptng-repeat 中的表单名称并将 ng-click 函数中的表单名称传递给 javascript
【发布时间】:2016-12-08 18:31:39
【问题描述】:

我在 ng-repeat 中使用不同的表单名称。

当点击表单内的某个按钮时,我想传递表单。

当我像下面这样打电话时

checkSaveDisable(updateProductSale_{{productIndex}}) it throwing some angular js error. 

可能是在函数调用中传递角度表达式。如何在函数中传递包含动态名称的表单。

HTML:

<div ng-repeat="productSale in productSales" class="existingProductSales" ng-init="productIndex=$index">
<form name="updateProductSale_{{productIndex}}" novalidate>

---------------//

<button class="btn btn-default save-btn save-sale" ng-disabled="checkSaveDisable(updateProductSale_{{productIndex}})" >Save</button>

</form>
</div>

【问题讨论】:

  • 你想达到什么目的?您可以使用ngForm 指令在ngRepeat 中处理forms
  • @developer033 尝试使用 ngForm 但想将动态表单对象传递给 javascript
  • 为了什么你需要传递表格?

标签: javascript jquery html angularjs forms


【解决方案1】:

updateProductSale_{{productIndex}} 是一个字符串值,对吧?如果是这样,要将字符串值作为参数传递,请尝试使用

ng-disabled="checkSaveDisable('updateProductSale_{{productIndex}}')"

更新:好的,如果您使用以下内容呢?

ng-disabled="checkSaveDisable('updateProductSale_' + {{productIndex}})"

angular.module('MyApp', []).controller('AppCtrl', function($scope) {
  $scope.productSales = ['Form1', 'Form2'];
  
  $scope.click = function(val) {
    alert(val);
  };
});
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.5.5/angular.min.js"></script>

<div ng-controller="AppCtrl" ng-cloak="" ng-app="MyApp">
    <div ng-repeat="productSale in productSales">
        <form name="updateProductSale_{{$index}}" novalidate>
            <button class="btn btn-default save-btn save-sale" ng-click="click('updateProductSale_' + $index)" >Save</button>
        </form>
    </div>
</div>

【讨论】:

  • updateProductSale_ 是一个常量值,{{productIndex}} 是一个动态值,尝试在函数中传递连接的结果,请看更新的答案。我希望这个想法很清楚。如果您仍有疑问,请告诉我。
  • @Antipod 它不会传递表单对象。它只是传递字符串
  • @SivaRajini 啊哈,我明白了。什么是表单对象?它是控制器范围内的对象吗?我会说不。我看不到您如何在表单中设置值,您没有提供代码。我会将表单中的值绑定到一个模型,该模型将是一个数组,传递元素的索引以找到它,然后在函数中使用它。我不喜欢的另一个选择是将前缀作为第一个参数传递,将动态部分(当它是一个对象,而不是纯值)作为第二个参数传递。然后我会构造表单名称并使用 angular.element 函数来查找表单。
猜你喜欢
  • 2015-02-15
  • 1970-01-01
  • 2015-02-17
  • 1970-01-01
  • 2017-04-29
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
相关资源
最近更新 更多