通过从多个输入字段(文本框)获取值来追加数组

时间:2019-02-04 12:32:32

标签: arrays textbox aurelia

我正在使用Aurelia Framework。我的HTML视图上有四个文本框字段和一个按钮。

我创建了一个服务,其中声明了JSON类型Array。现在我希望当用户填充文本框时,值应该以对象形式追加到我的数组中。

export class Std_service{
    rows:any;
    constructor(){
        this.rows = [{
            "name": "Aamir",
            "age": 20,
            "email": "aa@hotmail.com",
            "id" : 1
        }, {
            "name": "Adil",
            "age": 50,
            "email": "aaa@hotmail.com",
            "id" : 1
        }, {
            "name": "Usman",
            "age": 45,
            "email": "aaaaaa@hotmail.com",
            "id" : 1
        }];
    }


}

1 个答案:

答案 0 :(得分:3)

让我们说您有绑定到输入字段的变量。 让我们为id保存一个变量(它是在用户不知情的情况下生成的)

您可以在您的类中添加一个函数,用于处理数组和清除文本框。

export class Std_service{
    id: number = 0;
    name: string = "";
    age: string = "";
    email: string = "";

    rows:any = [];
    addRow()
    {
        this.rows.push({"name": this.name,
            "age": this.age,
            "email": this.email,
            "id" : this.id});

        this.name = "";
        this.age = "";
        this.email = "";
        this.id++;
    }
}
<input type="text" value.bind="name">
<input type="text" value.bind="age">
<input type="text" value.bind="email">
<button click.delegate="addRow()">add user to array</button>