角度4延伸基础零部件

Question

我有一个基础组件，它由它的孩子扩展，但当我们在Angular中使用angular-cli创建一个新的组件时，它会创建html和css文件，但我不会从基础组件使用这些文件。

有没有办法在没有html和css的情况下创建一个基础组件？

import { Component, OnInit, Input } from '@angular/core';

@Component({
  selector: 'app-base',
  templateUrl: './base.component.html', //I dont need this
  styleUrls: ['./base.component.css'] ////I dont need this
})
export class BaseComponent implements OnInit {

  constructor() {}

  ngOnInit() {}

}


import { Component } from '@angular/core';

import { BaseComponent } from '../base/base.component';

@Component({
  selector: 'app-child',
  templateUrl: './child.component.html',
  styleUrls: ['./child.component.css']
})
export class ChildComponent extends BaseComponent {

  constructor() {
    super();
  }

  ngOnInit() {
  }

}

Answer 1

因为基类不需要自己实例化，所以它是抽象类，不需要有@Component装饰器。

如果基类有依赖关系，并且有可能在子类中省略constructor并继承它，基类应该有@Injectable装饰器：

@Injectable()
export abstract class BaseComponent implements OnInit {
  constructor(public dep: Dep) {}

  ngOnInit() {}
}

@Component({
  selector: 'app-child',
  templateUrl: './child.component.html',
  styleUrls: ['./child.component.css']
})
export class ChildComponent extends BaseComponent {
  // dummy constructor can be omitted
/*
  constructor(dep: Dep) {
    super(dep);
  }
*/
}