【问题标题】:Angular-4 :Using checkboxes for multi selectAngular-4:使用复选框进行多选
【发布时间】:2018-05-08 03:24:37
【问题描述】:

使用 Angular 4--当未选中复选框时,如何从数组中删除项目? 有人可以展示这样做的组件功能吗??? 非常感谢。 我的代码如下:

**app.component.html:**

<div>
<h2>SAMPLE</h2>
<input [(ngModel)] = "newItem" type="text" placeholder="Add Item">
<button (click)="addItem()">ADD</button>
<ul *ngFor="let i of Items ; let ind=index" >
<li><input type="checkbox" [checked]="stat" (click)="flagged(ind)" >{{i}}</li>
</ul>
<ul *ngFor="let f of flaggedItems"><li>
<h3>Flagged array : {{f}}</h3>
</li></ul>
</div>


**app.component.ts :**

flagged(index) {
    this.toggler();
    this.i = 0;
    while (this.i < this.flaggedItems.length )
        {
        if ( index === this.flaggedItems[this.i]){
          this.presentin = this.i;
          this.present = true;
          break;
        }
      this.i++;
       }
       if (this.stat === true && !this.present) {
          this.flaggedItems.push(index);
       }
    else {
         this.flaggedItems.splice( this.presentin, 1);
       }
  }

  toggler() {
    if (!this.stat){
      //this.pr = 'checked';
      this.stat = true;
     }
    else {
      //this.pr = 'Unchecked';
      this.stat = false;
    }
  }

【问题讨论】:

  • 那么你到目前为止尝试了什么

标签: javascript angular checkbox angular4-forms


【解决方案1】:

你试过了吗?

(change)="doSomething($event)"

这可能是处理复选框最合适的事件。

【讨论】:

    猜你喜欢
    • 2018-03-20
    • 1970-01-01
    • 2019-04-30
    • 1970-01-01
    • 1970-01-01
    • 2018-09-05
    • 2021-12-06
    • 1970-01-01
    • 1970-01-01
    相关资源
    最近更新 更多