时间戳

首页 > 解决方案 > 从@input 值单击的所有复选框

javascript - 从@input 值单击的所有复选框

问题描述

我的组件中有一个@Input，基于它我想构建一个输入和复选框。

import { Component, EventEmitter, Input, OnInit, Output } from '@angular/core';

@Component({
  selector: 'app-aside',
  templateUrl: './aside.component.html',
  styleUrls: ['./aside.component.css']
})
export class AsideComponent implements OnInit {

 @Input() Segmenty;
 @Output() checkedSegment : EventEmitter<string[]> = new EventEmitter();


  constructor() {
   }

  ngOnInit(): void {

  }


}

我当前的 html ：

<div *ngFor ="let segment of Segmenty" >
  <input type="checkbox" checked="checked" > {{segment}}
 <button (click)="allclickedSegment()"></button>
</div>

如何构建 html 和一个将收集到 @Output 我单击到数组中的所有复选框的函数。

可以返回的数组是 之间的字母：

'A', 'B', 'C', 'D', 'E', 'F', 'G'

标签： javascriptangulartypescript

解决方案

如果我理解正确，在每次单击分段时，您将该分段的索引传递给 allclickedSegment() 函数，然后将索引存储在数组（）中，然后您可以根据索引数组返回特定​​字母，（或u 可以存储一个静态键/值对象，该对象根据段索引表示这些字母。（这种方法仅在返回的字母与模板中的段长度相同时有效）。

推荐阅读