Question

我有一个Angular 2组件，它使用@Input类字段装饰器以及getter和setter，如下所示：

＆＃13;

import {Component, Input, Output, EventEmitter,FORM_DIRECTIVES, CORE_DIRECTIVES} from 'angular2/angular2';

@Component({
    selector: 'binding-test3',
    templateUrl: './components/binding-test/binding-test3.html',
    directives: [CORE_DIRECTIVES,FORM_DIRECTIVES]
})

export class BindingTest3 {

    @Input() value: string;
    @Output() valueChange:EventEmitter = new EventEmitter();

    private _value: string;

    get value() {
        console.log('getting value in BindingTest3: ',this._value);
        return this._value;
    }

    set value(value) {
        console.log('setting value in BindingTest3: ',value);
        this._value = value;
        this.valueChange.next(value);
    }
}

＆＃13;

代码运行正常但有三个编译器错误：

app / components / binding-test / binding-test3.ts（15,14）：错误TS2300：重复的标识符＆＃39;值＆＃39;。 app / components / binding-test / binding-test3.ts（20,9）：错误TS2300：重复的标识符＆＃39;值＆＃39;。 app / components / binding-test / binding-test3.ts（25,9）：错误TS2300：重复的标识符＆＃39;值＆＃39;。

关于如何解决这个问题的任何想法？

Answer 1

将@Input与set：

组合在一起

@Input() set value(value:string) { ... }

Attribute Directives开发人员指南页面上有一个示例：

@Input() set defaultColor(colorName:string) {...}

带有Getter和Setter的Angular2组件输入上的重复标识符错误

1 个答案: