Question

我有六个文本框，我想计算填充框的数量

<input type="text" #tb1 placeholder="Weight" class="form-control"(ngModelChange)="counterfunc(tb2)" />
<input type="text" #tb2 placeholder="Weight" class="form-control"(ngModelChange)="counterfunc(tb2)" />
<input type="text" #tb3 placeholder="Weight" class="form-control"(ngModelChange)="counterfunc(tb3)" />
<input type="text" #tb4 placeholder="Weight" class="form-control"(ngModelChange)="counterfunc(tb4)" />
<input type="text" #tb5 placeholder="Weight" class="form-control"(ngModelChange)="counterfunc(tb5)" />
<input type="text" #tb6 placeholder="Weight" class="form-control"(ngModelChange)="counterfunc(tb6)" />

{{counter}}

counter: number = 0;

counterfunc(tb){
    // need help here
    if (tb.value != '') {
        this.counter++;
    }
}

我找到了这个plunker plunkr，但这是复选框。如何计算填充文本框的数量？如果用户清空该框，则一些计数应减少一个。谢谢

Answer 1

我没有看到为组件（井，输入）声明几个变量的点，在任何情况下都表现完全相同。您应声明输入列表，而不是每个输入的变量。

使用儿童装饰器

<ng-container *ngFor="let i of [0, 1, 2, 3, 4, 5]">  
  <input type="text" #textboxes placeholder="Weight" class="form-control" (input)="input()"/>
</ng-container>

<p>{{filledCount}}</p>

在您的TS中

filledCount: number = 0;
@ViewChildren('textboxes') textboxes: QueryList<ElementRef>;
input() { this.filledCount = this.textboxes.filter(t => t.nativeElement.value).length; }

这是 working stackblitz 。

Answer 2

尝试这个，只需将其作为关键

macro foo(&block)
  {{ block.args.first.stringify }}
end

p foo {|x| 0 } # => "x"

Answer 3

创建表单并向表单添加验证。每次更改都会计算有效或无效字段

如何计算角度2中的填充文本框

3 个答案: