從數值生成選擇選項

Question

我正在嘗試根據變量生成下拉列表。

說如果totalqty是5，我需要生成下拉選項爲1,2,3,4,5。

我有angular1做到了，但對我來說

<select> 
     <option *ngFor="let i of arr(totalqty).fill(1)">{{i}}</option> 
    </select> 

Answer 1

您不能直接在您的模板做它不工作。

做在你的組件，而不是見我的工作演示：https://plnkr.co/edit/6Ma2tkfSKfpzxQmiNQl1?p=preview

有2種方式：

• 產生陣列
• 使用管道

@Pipe({ name: 'createArrayOfValues' }) 
export class CreateArrayOfValuesPipe implements PipeTranfsform { 
    public transform(qty: number): number[] { 
    if (!qty || isNaN(qty)) return []; 
    return new Array(qty).fill(0).map((v, i) => i + 1); 
    } 
} 

@Component({ 
    selector: 'my-app', 
    template: ` 
    <div> 
     <h2>Hello {{name}}</h2> 
    </div> 
    <select> 
     <option *ngFor="let i of values">{{i}}</option> 
    </select> 
    <select> 
     <option *ngFor="let i of zerovalues; let idx = index;">{{idx + 1}}</option> 
    </select> 
    <select> 
     <option *ngFor="let i of 5 | createArrayOfValues">{{i}}</option> 
    </select> 
    `, 
}) 
export class App { 
    name:string; 
    values = []; 
    zerovalues = []; 

    constructor() { 
    this.name = 'Angular2' 
    this.updateValues(5); 
    } 

    updateValues(qty: number) { 
    this.values = new Array(qty).fill(0).map((v, i) => i + 1); 
    this.zerovalues = new Array(qty).fill(0); 
    } 
}