获取* ngFor选中复选框值角2

我JSON如下：获取* ngFor选中复选框值角2

[ 
    { 
    "name": "Parent", 
    "submenus": [ 
     { 
      "name":"Child1" 
     }, 
     { 
      "name":" Child2" 
     }, 
     { 
      "name":" Child3" 
     }, 
     { 
      "name":"Child4" 
     }, 
     { 
      "name":"Child5" 
     } 
    ] 
    } 
]

和代码在HTML文件中

<li *ngFor='let submenu of filterType.submenus'> 
     <div class="checkbox"> 
     <input id="checkbox1" class="styled" type="checkbox" [(ngModel)]="submenu.selected"> 
     <label for="checkbox1"> 
         {{submenu.name}} 
        </label> 
    </div> 

     </li>

如何获得只有那些复选框这是clicked..Please帮助我作为我高压传递选定的价值角向高图。

来源

2017-06-28 user2572561

想清楚 - 当你想检查你的复选框。正如我注意到你正在使用submenu.selected，但从你的JSON响应你没有选择属性的子菜单object.i你希望你得到它。 –

迭代，你可以创建一些临时JSON使用您的子菜单

filternames = [ 
      { 
       name: 'Child1', 
       checked: false 
      }, 
      { 
       name: 'Child2', 
       checked: false 
      }, 
      { 
       name: 'Child3', 
       checked: false 
      }, 
      ]; 

      checked() { 
      return this.filternames .filter(item => { return item.checked; }); 
     }

HTML

<li *ngFor='let submenu of filternames'> 
     <div class="checkbox"> 
     <input id="checkbox1" class="styled" type="checkbox" 
[(ngModel)]="submenu.checked" [value]="submenu.name"> 
     <label for="checkbox1"> 
         {{submenu.name}} 
        </label> 
    </div> 

     </li> 


     <pre>Selected names: <span *ngFor="let filternames of checked()" ">{{ filternames.name}}</span></pre

检查（）函数总是返回你的选择复选框值

来源

2017-06-28 04:36:51 CharanRoot

感谢您的回答，但我发现一个更好的解决方案，将submenu.name传递给事件，然后得到它推动它到阵列..链接.. https://plnkr.co/edit/mWtlkydF0FzioS3c2esQ?p=preview – user2572561

如果您的图应基于复选框选择而改变，那么您的解决方案非常优秀。 – CharanRoot

因为你已经绑定的复选框将模型：

[(ngModel)]="submenu.selected"

所有你需要做的就是爬行/通过filterType.submenus和过滤对于那些selected===true

来源

2017-06-28 04:21:43 BeetleJuice

谢谢你的回答，你可以请分享一段代码，如存储在阵列中选定的选中的值..再次提前感谢 – user2572561

获取* ngFor选中复选框值角2

回答

相关问题