【问题标题】:How get dynamic JSON data using chekboxes in Angular JavaScript?如何使用 Angular JavaScript 中的复选框获取动态 JSON 数据?
【发布时间】:2016-12-15 07:37:33
【问题描述】:

我很苦恼,找到了很多链接和文章,但找不到解决方案。我有一个这样的数组

$scope.cols=[
   {"dpname":"partname","search":'',"qparam":''},
   {"dpname":"partid","search":'',"qparam":''},
   {"dpname":"partdesc","search":'',"qparam":''}
]; 

我正在使用 ng-repeat 显示数组,并且我还重复复选框。当我单击特定复选框时,应打开一个文本框。文本框中给定的 ng-model 值被该特定复选框替换

在这里我附上了我尝试过的小提琴链接: http://jsfiddle.net/soumyagangamwar/3dygzn8e/

【问题讨论】:

  • 您错过提问了吗?你想达到什么目的?写下特征。
  • 您只想打开复选框下方的文本框?
  • 你的代码几乎无法阅读,我更新了你的fiddle

标签: javascript angularjs json


【解决方案1】:

看看这个Fiddle

虽然你没有在问题中明确提到你想要什么。但是,如果您希望每个项目都有自己的文本框,那么上面的小提琴应该可以回答您的问题。

<span ng-if="displayName">
   <input type="checkbox" id="searchName{{$index}}" ng-model="searchname[$index]" ng-change="changeColVisibility(col)">
</span>

<div ng-show="col.show">
  <input type="text" ng-model="name">
  <input type="button" value="submit" ng-click="setName(col)">
</div>

你应该尽量不使用索引,而应该更多地使用 angular 附带的 2 路绑定。既可以显示和隐藏文本框,也可以将数据保存在模型中,而不是创建大量函数来执行此操作。

【讨论】:

    【解决方案2】:

    我在此链接中调整了您的文件

    jsfiddle.net/3dygzn8e/1/

    基本上我所做的如下:

    1. 向数组中添加一个名为 ischeched 的新列,并将其默认为 false。这代表复选框检查状态
    2. 将复选框绑定到 col.ischecked
    3. 我将文本框 ng-show 条件更改为 ng-show="col.ischecked"

    【讨论】:

      猜你喜欢
      • 2011-03-30
      • 2011-09-06
      • 1970-01-01
      • 2017-06-16
      • 2019-12-20
      • 2016-11-15
      • 2023-03-04
      • 1970-01-01
      • 1970-01-01
      相关资源
      最近更新 更多