Angular 如何在不同的角度分量中使用相同的函数

我有一个组件a，其中有一组2个函数和2个类属性，另一个组件B也需要使用。 以前我只是将这些代码部分复制粘贴到组件B中并使用它。 但我很确定做一些冗余代码是不正常的

编辑：事实上，我有一个具有复杂表单的组件“addelement” 第二个是“修改元素”，我想对这两个组件使用相同的框架

有人知道如何在第8节中实现这一点吗？

---

提前感谢，

如果目标是避免冗余代码，并且组件不需要共享状态（属性值），那么可以使用抽象类

export abstract class AbstractComponent {

  property1: string;
  property2: long;

  commonMethod(): string {
      ...
  }
}

@Component({
   selector: 'app-component1',
   ...
})
export class Component1 extends AbstractComponent {
   ...
}

@Component({
   selector: 'app-component2',
   ...
})
export class Component2 extends AbstractComponent {
   ...
}

---

我在应用程序中使用了相同的场景。我想创建动态地址组件。用于多种形式。所以首先我创建公共组件

import { Component, OnInit, Input, Output, EventEmitter, OnDestroy, AfterViewInit } from '@angular/core';
import { AddressModal } from '../../modals/opportunity.modal';
import { FormGroup, FormBuilder, FormControl, Validators } from '@angular/forms';

@Component({
  selector: 'app-address',
  templateUrl: './address.component.html',
  styleUrls: ['./address.component.css'],
})
export class AddressComponent implements OnInit, AfterViewInit {

  form_address: FormGroup;
  @Input('addressModal') addressModal: AddressModal;

  @Output()
  private formReady: EventEmitter<FormGroup> = new EventEmitter<FormGroup>();

  listCountry = [];
  public formSubmitAttempt: boolean = false;

  constructor(private fb: FormBuilder) {
    this.getCountryList();
    this.createForm();
  }

  ngOnInit(): void {
    this.formReady.emit(this.form_address);
    if (this.addressModal && this.addressModal !== undefined) {
      setTimeout(function () {
        this.form_address.setValue(this.addressModal);
      }.bind(this), 500);

    }
  }

  ngAfterViewInit(): void {


  }
  createForm() {
    const requiredValidations = [
      Validators.required,
      this.conf.noWhitespaceValidator,
    ];

    this.form_address = this.fb.group({
      id: [''],
      row_id: [''],
      opportunity_id: [''],
      address1: ['', requiredValidations],
      address2: [''],
      city: ['', requiredValidations],
      state: ['', requiredValidations],
      zipcode: ['', requiredValidations],
      country: ['S1ptmVWUWsjyGvlr', requiredValidations],
      added_date: [''],
      modified_date: [''],
      status: ['']
    });
  }

  getCountryList() {
    let _self = this;
    this.conf.getApiCall('get_countries', {}, function (res) {
      if (res.data !== undefined && res.data.countries != undefined) {
        _self.listCountry = res.data.countries;
      }
    }, function (err) {
      console.log(err);
    });
  } 
}

---

我刚刚在angularI中发现了这个主题尝试探索angularI我是angularI的新手，我无法想象如何创建一个服务，它可以在多个组件上使用函数：sI将探索更多，TYI必须共享属性数据，所以更好地使用服务？嗨，我想在两个组件中共享并使用相同的形式。一个组件用于插入，第二个组件用于修改，以便在表单中预选一些值。我该怎么办？我试图创建一个服务，但当我在服务中创建表单，并在组件中的表单上创建patchValue时，它表示patchValue为nocannot read patchValue of undefined。当我在顶部控制台上记录表单时，表单就被删除并初始化了。

   <app-address (formReady)="addFormControl($event)" [addressModal]="address"></app-address>

private addFormControl(name: string, formGroup: FormGroup): void {
    if (!this.form1.controls[name] && !this.form1.controls[name] !== undefined) {
        this.form1.addControl(name, formGroup);
    }
}

private addBlankAddress(): void {
    let address_obj: AddressModal = {
        id: '',
        row_id: this.conf.randomRowId(),
        opportunity_id: '',
        address1: '',
        address2: '',
        city: '',
        state: '',
        zipcode: '',
        country: 'S1ptmVWUWsjyGvlr',
        added_date: '',
        modified_date: '',
        status: ''
    };
    this.list_address.push(address_obj);
    //return address_obj;
}