如何使用JavaScript将多个选定的复选框值添加到数组?

时间:2020-03-10 13:09:24

标签: javascript html arrays angular typescript

我有一个输入元素,正在使用* ngFor循环填充另一个数组中的数据。在选择多个复选框时,我需要将其值放入我的空数组“ selectedArr”中。 在下面的代码中找到:

def uniform(n):
    global _first_random
    if n==0: random.seed(1234); _first_random=0
    if _first_random==1: random.seed(None); _first_random=0
    if n==1: return random.random()
    else: return floor(n*random.random()+1)

_first_random=1
r = 10

def generate_random(number):
    """
    Function for creating random position for n charges

    Parameters
    ---------
    number -- number of charges in the system. Takes integer values.

    Outputs 
    --------
    charges_radius,
    charges_theta

    """
    charges_radius = []
    charges_theta = []
    for i in range(number):
        radius = randrange(r)
        theta= np.random.random() * 2.0 * np.pi
        while theta in charges_theta and radius in charges_radius or radius==0 and radius in charges_radius:
            radius = uniform(10)
            theta= np.random.random() * 2.0 * np.pi
        charges_radius.append(radius)
        charges_theta.append(theta)
    return charges_radius,charges_theta



def cosRule(rad1,rad2,ang1,ang2):
    q = 1.0
    net= ang2-ang1
    net_distance = sqrt(rad1**2+rad2**2-2*rad1*rad2*cos(net))
    try:
        energy = q*q*(1.0/net_distance)

    except ZeroDivisionError:
        energy = 1e12
    return energy

def partial_energy(no,radii,thetas,enMatrix):
    """
    no- ordinary number of the charge that you moved and calculate the change in energy as a result of displacement" 
    """
    radiusA = radii[no]
    thetaA  = thetas[no]
    for key,theta in enumerate(thetas):
        if key!=no:
            radiusB = radii[key]
            thetaB = theta
            energy = cosRule(radiusB,radiusA,thetaB,thetaA)
            enMatrix[key][no]= 0.5*energy
            enMatrix[no][key] = enMatrix[key][no]
    return enMatrix

def total_energy(n,radius,thetas):
    enMatrix = np.zeros([n,n])
    energy = None
    for i in range(n):
        enMatrixNew= partial_energy(i,radius,thetas,enMatrix=enMatrix)
        energy = sum(enMatrixNew).sum()
    return energy,enMatrix

def recalculate(n,radius,thetas,enMatrix,which):
    enMatrixNew = np.zeros([n,n])
    enMatrixNew=partial_energy(which,radius,thetas,enMatrix)
    energy = sum(enMatrixNew).sum()
    return energy,enMatrixNew



def tempScaling(a):
    T_s = -a/log(0.7) 
    T_f = -a/log(0.01) 
    return T_s, T_f


T_s, T_f = tempScaling(0.2)


def moveCharge(number,thetas,radius):
    r = 10
    step = 2.05
    which = randrange(number)
    thetas[which] =2*uniform(1)*np.pi
    n = randrange(1,3)
    delta_radius = (-1)**n *step
    radius[which] +=delta_radius
    if radius[which]>r or radius[which]<0.0:
        radius[which] +=(-1)**(n+1) * step
    return thetas,radius,which


def acceptChange(newset,delta,val_dic,c,Ts):
    if delta >0.0:
        accept_the_change = uniform(1) # generating a random number to decide if we accept the change
        if accept_the_change < exp(-delta/Ts):
            val_dic[c]=[]
            val_dic[c]={"radius":newset[0],"theta":newset[1],"energy":newset[2],"energies":newset[3]}   

        else:
            val_dic[c]=[]
            val_dic[c]=val_dic[c-1]

    else:
        val_dic[c]=[]
        val_dic[c]={"radius":newset[0],"theta":newset[1],"energy":newset[2],"energies":newset[3]} 
    return val_dic    
import { Component } from "@angular/core";

@Component({
  selector: "app-root",
  templateUrl: "./app.component.html",
  styleUrls: ["./app.component.css"]
})
export class AppComponent {
  title = "CodeSandbox";
  toDo = ["Test", "Eat", "Sleep"];
  task: string;
  addTask(task: string) {
    this.toDo.push(task);
  }
  selectedArr = [];
  deleteValue() {}

  addSelected(i) {
    let checkId = document.getElementsByClassName("i");
    console.log(checkId);
    if (checkId.checked === true) {
      this.selectedArr.push(i);
    }
    console.log(this.selectedArr);
  }
}

3 个答案:

答案 0 :(得分:2)

尝试这样:

.html

 <li *ngFor="let todo of toDo, index as i">
     <input class="i" type="checkbox" [(ngModel)]="checked[i]" (ngModelChange)="addSelected(todo,$event)" />
    {{todo}}
 </li>

.ts

  checked = []

  selectedArr = [];


  addSelected(item,evt) {
    if (evt) {
      this.selectedArr.push(item);
    }else {
      let i = this.selectedArr.indexOf(item)
      this.selectedArr.splice(i,1)
    }
  }

Working Demo

答案 1 :(得分:0)

getElementsByClassName接口的Document方法返回具有所有给定类名称的所有子元素的类似数组的对象。由于您正在传递索引,因此可以访问单击的元素,例如:

addSelected(i) {
   let checkId = document.getElementsByClassName("i")[i];
   console.log(checkId);
   if (checkId.checked) {
      this.selectedArr.push(i);
   } else {
      // Remove the index from selectedArr if checkbox was unchecked
      let idx = this.selectedArr.indexOf(i)
      if (idx > -1) this.selectedArr.splice(idx, 1)
   }
   console.log(this.selectedArr);
}

答案 2 :(得分:0)

请,简单的事情很容易实现。您实际上不需要手动操作数组。您应该使用函数(*)

get selectedArray()
{
    return this.toDo.filter((x,index)=>this.checked[index])
}

<li *ngFor="let todo of toDo, index as i">
     <!--remove (ngModelChange) -->
     <input class="i" type="checkbox" [(ngModel)]="checked[i]" />
    {{todo}}
</li>
{{selectedArray}}

(*)这使您可以选择一些“启动”应用程序

相关问题