打字稿复杂构造函数

debugcn 发表于 Dev

朱利托·加卢波

这是我的场景，我实际上是 Typescript 的新手，所以我不知道这是否可行。来吧，我有课

export class XClass {
    constructor(
        public a?: string,
        public b?: string
    ) {
    }
}

我需要另一个班级的这个 XClass

export class YClass {
    constructor(
        public xClass?: XClass ,
        public c?: string
    ) {
    }
}

然后我会像这样使用它。

    <div class="form-group">
        <table name="xClass" id="field_xClass" [(ngModel)]="yClass.xClass">
            <thead>
                <tr>
                    <th>A</th>
                    <th>B</th>
                </tr>
            </thead>
            <tbody>
                <tr>
                    <td contenteditable="true" name="a" id="field_a" [(ngModel)]="yClass.xClass.a"></td>
                    <td contenteditable="true" name="b" id="field_b" [(ngModel)]="yClass.xClass.b"></td>
                </tr>
            </tbody>
        </table>
    </div>

但是我遇到了很多问题，例如“错误：没有名称的表单控件的值访问器：'xClass'”，如果 xClass 为空，“TypeError：无法读取 null 的属性 'a'”，如果 xClass.a 为空。

朱利托·加卢波

我的一个同事能够解决这个问题，他所做的是删除 [(ngModel)]="yClass.xClass" 而不是使用

<td contenteditable="true" name="a" id="field_a" [(ngModel)]="yClass.xClass.a"></td>

他曾经

<td><input type="text" class="form-control" name="xClass_a" id="field_xClass_a [ngModel]="yClass?.xClass?.a" (ngModelChange)="yClass.xClass.a = $event" /></td>

现在我遇到的唯一问题是，如果我编辑“a”字段，则会收到此类型错误：无法设置属性“a”为空。

我已经尝试在 YClass 上的构造函数之后硬编码默认值，但它不起作用。

完毕。我在 ngOnInit() this.yClass.xClass = this.yClass.xClass 上填充默认值？this.yClass.xClass : {a : '', b : ''};

本文收集自互联网，转载请注明来源。

如有侵权，请联系[email protected] 删除。