Question

我有一个由其子节点扩展的基本组件，但是当我们使用angular-cli在Angular中创建一个新的组件时，它会创建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);
  }
*/
}

角度4扩展基础组件

1 个答案: