说我有课:
export class ItemType{
readonly itemtype_id: number;
public name :string;
constructor(itemtype_id: number, name: string) {
this.itemtype_id = itemtype_id;
this.name = name;
}
}
现在我制作了一个可编辑标签的单独组件。
<div class="row">
<div class="col-xs-4">
<h4><span class="xvrfont padding">{{label}}</span></h4>
</div>
<div class="col-xs-2"></div>
<div class="col-xs-5">
<div *ngIf="editing">
<input #editableField
[required]="required"
(blur)="onBlur($event)"
[name]="value"
[(ngModel)]="value"
[type]="type"
[placeholder]="label"
(keyup.enter)="onEnter()"
(mouseover)="$event.target.select()"
/>
</div>
<div *ngIf="!editing">
<h4 title="Click to edit" (click)="edit(value);" (focus)="edit(value);" tabindex="0" class="inline-edit">{{value}} </h4>
</div>
</div>
</div>
当我调用此组件时,我希望根据属性是否为readonly来编辑该字段。如果该属性是只读的,则该字段不应该是可编辑的。如果它不是,它应该。
<app-editable-field [isEditable]={{**check if the property is readonly**}} label='Label" [required]="true" type="text"></app-editable-field>
有一种简单的方法来检查类中的属性是否为readOnly / private?
答案 0 :(得分:5)
问题是您的Typescript被编译为Javascript,始终牢记这一点。
所以所有类型和公共/私有检查(以及使得Typescript很棒的所有其他东西)只能在编译时执行。一旦将其编译为Javascript,所有这些信息都会丢失。这意味着,在运行时,由于浏览器正在执行普通的Javascript,因此无法检查成员是私有还是只读。
为了说明这一点,请查看此链接以查看您的Typescript类编译到的内容:TypeScript Playground
正如dsfq在评论中指出的那样,使用布尔成员来指示该字段是否可编辑。