初始化一个空的打字稿对象,但定义它的属性

时间:2019-10-22 02:11:22

标签: typescript

我正在使用模板驱动的方法练习Angular-Forms。我的目标是构建一个UI来包含我的数据结果,如下所示:

            <hr>
            <div class="well well-lg">
              <p>Email Address: <span class="bg-info">{{data.email}}</span></p>
              <p>Subscription Type: <span class="bg-info">{{data.sub}}</span></p>
              <p>Password: <span class="bg-info">{{data.pass}}</span></p>
            </div>

所以我在打字稿中的data对象将把这3个道具当作字符串,而我目前将此作为初始化程序:data: {email: string, sub: string, pass: string};

在构造函数中,我有:

this.data.email = '';
this.data.sub = '';
this.data.pass = '';

在表单提交中,我有:

if(this.myForm.valid){
      this.data.email = this.myForm.value.email;
      this.data.sub = this.myForm.value.subscription;
      this.data.pass = this.myForm.value.password;
      this.myForm.reset();
    }

重新加载后,我得到:ERROR TypeError: Cannot set property 'email' of undefined

我有99%的把握是因为我声明此对象的方式。但是似乎我声明了它->给它的属性提供类型->给构造函数提供默认值。但是在构造函数中this.data是未定义的。

这样做的打字稿方式是什么?

1 个答案:

答案 0 :(得分:1)

数据未定义,因此无法将属性附加到未定义的对象。 请在您的构造函数中尝试以下方法:

this.data = {
    email: '',
    sub: '',
    pass: '',
};