Angular 6中组件之间共享逻辑时,如何使用合成而不是继承?

我在Angular中有一个结构如下的模块:

moduleName
    componentA
    componentB

现在componentA和componentB非常相似,因为它们共享一些属性和方法,例如:

protected available: boolean = true;

因为不想重复自己,所以我创建了一个基类,用于存储所有这些内容:

export abstract class BaseComponent {
    protected available: boolean = true;
}

并且两个控制器都从该类继承:

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

export class ComponentA extends BaseComponent implements OnInit {
    constructor() {
        super();
    }

    ngOnInit() {
        console.log(this.available);
    }
}

这样很好.但是,当我研究这种灵魂时,很多人都在说:

Don’t use inheritance, use composition in this case.

好的,但是我该如何使用合成呢?与当前解决方案相比,收益真的那么大吗?

非常感谢您的宝贵时间.

解决方法:

为了使对象成角度,您需要在类内部引用该对象,该对象共享数据和功能.为此,您需要使用Angular服务,并将它们注入到您的类中,并且每个组件应该有1个服务实例.

>通过运行ng g s my-service创建新服务
>添加公共可用:boolean = true;服务
>通过组件的服务,在组件上的@Component配置中
>将服务注入到您的两个组件构造函数中,构造函数(private myService:MyService)

现在,您可以保留数据和功能

上一篇:使用组合(java)时如何实现关闭开关?


下一篇:CodeGo.net>如何添加属性到现有接口?