Angular 2.3组件继承

我想把一些常见的代码添加到窗体等服务器错误，并将用于我的所有窗体组件中的基本窗体组件。Angular 2.3组件继承

我简化了示例代码来演示我的问题。

import { Component, } from '@angular/core'; 
import { Validators } from '@angular/forms'; 
import { FormGroup, FormBuilder } from '@angular/forms'; 


export abstract class BaseFormComponent { 
    form: FormGroup; 
    fb = new FormBuilder; 
    submitted = false; 
    busy: boolean; 

    onSubmit() { 
    this.submitted = true; 
    this.busy = true; 
    } 
} 

@Component({ 
    selector: 'my-form', 
    template: ` 
    <form [formGroup]="form" (ngSubmit)="onSubmit()" novalidate> 
     <div class="form-group"> 
     <label>Name</label> 
     <input formControlName="name" class="form-control"> 
     </div> 
     <button type="submit" [disabled]="busy" class="btn btn-primary">Submit</button> 
    </form> 
    ` 
}) 
export class FormComponent extends BaseFormComponent { 

    constructor() { 
    super(); 
    this.createForm(); 
    } 

    protected createForm() { 
    this.form = this.fb.group({ 
     name: ['', Validators.compose([Validators.required, Validators.maxLength(10)]) ], 
    }); 
    } 
}

出于某种原因，我得到的错误是模板找不到基类属性。

Error: [21, 24]: The property "form" that you're trying to access does not exist in the class declaration. [21, 42]: The method "onSubmit" that you're trying to access does not exist in the class declaration. [26, 41]: The property "busy" that you're trying to access does not exist in the class declaration. [21, 24]: The property "form" that you're trying to access does not exist in the class declaration. [21, 42]: The method "onSubmit" that you're trying to access does not exist in the class declaration. [26, 41]: The property "busy" that you're trying to access does not exist in the class declaration.

我的代码相比这article，好像除了我没有装修基本形式类的成分几乎相同。无论如何，装饰基类似乎没有任何区别。

我使用：

来源

2017-06-03 Ceebs

继承应该这样做。这是Codelyzer错误。不是TS或您标记为相关的任何其他内容。它应该被相应地对待。 – estus

要回答我的问题。正如@estus提到的那样，代码没有问题，这个问题与Codelyzer有关。这个问题可以在这里找到。

https://github.com/mgechev/codelyzer/issues/191

一个临时的解决这个问题是简单地把下列评论在文件的顶部，直到tslint和codelyzer之间的问题已经理清忽略它。

// tslint:disable:no-access-missing-member

来源

2017-06-04 06:58:32 Ceebs

我设法通过将我的文件添加到版本控制即.Subversion来解决我的问题。 – Twahanz

Angular 2.3组件继承

回答

相关问题