Typescript Angular 4中模型对象的getter和setter

发布于06月13日

我怎样才能让getter和setter在我的模型课上发挥作用？

我的目标是在输入时计算所选日期的整数值，其中包含更新的日期.我本来打算用setter来做，但Angular 4忽略了我模型的setter和getter.

我的模范班:

export class MyModel {
    @Input('date')
    get date(): String {
        console.log('Getting date');
        ...
    }

    set date(val) {
        console.log('Setting date: ' + val);
        ...
    }
}

我的模板:

...
<input class="form-control" name="dp" [(ngModel)]="model.date">
...

但盖特和塞特不起作用.我错过了什么？

推荐答案

将date属性声明为输入的方式看起来不正确，但如果不查看所有代码，很难说这是否是唯一的问题.与其使用@Input('date')，不如像这样声明date属性:private _date: string;.此外，确保您正在使用new关键字实例化模型.最后，使用常规点符号访问属性.

根据以下https://www.typescriptlang.org/docs/handbook/classes.html个示例判断您的工作:

let passcode = "secret passcode";

class Employee {
    private _fullName: string;

    get fullName(): string {
        return this._fullName;
    }

    set fullName(newName: string) {
        if (passcode && passcode == "secret passcode") {
            this._fullName = newName;
        }
        else {
            console.log("Error: Unauthorized update of employee!");
        }
    }
}

let employee = new Employee();
employee.fullName = "Bob Smith";
if (employee.fullName) {
    console.log(employee.fullName);
}

下面是一个plunker，展示了你想要做的事情: