web-dev-qa-db-fra.com

Angular 9 BaseComonent avec @Injectable ()

Dans Angular 8, j'ai pu créer des composants de base (classes le composant réel ingérez de) avec un attribut "@injectable". Le compilateur Angular 9 me dit:

Le composant que votre composant hérite de son constructeur à partir du basocomposant, mais celui-ci n'a pas de décorateur Angular de ses propres. L'injection de dépendance ne sera pas en mesure de résoudre les paramètres du constructeur de BasEcomonent. Ajoutez un décorateur @Directif à BasEcomonent ou ajoutez un constructeur explicite à des rolesélectdialogcomponent.

Quel est le moyen Angular 9 de faire ces choses maintenant? Cela fonctionne mais semble en quelque sorte hacky:

@Component({
    selector: 'baseComponent',
    template: 'no-ui'
})
angularangular9
11
tris

Cela va probablement frapper plus de gens maintenant que Angular 10 est sorti et l'avertissement est maintenant une erreur.

erreur NG2007: classe utilise Angular Caractéristiques mais n'est pas décorée. Veuillez ajouter un explicity Angular Decorator.

Cette entrée de blog montre quelques exemples https://volosoft.com/blog/what-is-new-in-angular-1

De plus, veuillez noter que les "fonctionnalités angulaires" ne veulent pas dire une injection de dépendance. Même la présence de ngOnDestroy() dans votre classe de base déclenchera ceci.

Je l'ai résolu en renommant ngOnDestroy() à _ngOnDestroy() et l'ai appelée de la sous-classe sur la destruction de la réelle @Injectable(). Cela semble un peu dangereux si je devais toujours la sous-classer et oublié d'appeler _ngOnDestroy() mais je ne suis pas sûr d'avoir eu beaucoup de choix.

1
Simon_Weaver

Vous devrez soit ajouter un décorateur (@Directif) à la classe de base ou supprimer n'importe quel Angular mise en œuvre par la classe de base. Cette erreur a commencé à apparaître après avoir mis à niveau une application sur Angular 10. Une classe de base abstraite impliquait Angular OnInit interface. Cette classe a ensuite été étendue par des classes de composants réels. Au lieu d'ajouter un décorateur non pertinent, je Suppression de la mise en oeuvre OnInit de la classe de base qui corrigeait l'erreur.

0
Atif Majeed

Ce modèle a été obsolète en V9 et n'est plus supporté en V10.

Il existe une migration qui migre généralement ces cas automatiquement https://angular.io/guide/migration-undécorated-classes et https://angular.io/guide/migration-Injectable , cependant, il se peut que le cas hérité @IJeject () n'est pas manipulé.

Quoi qu'il en soit, la résolution ici est d'ajouter @Ijecttable () à la classe de base abstraite.

0
San Jaisy

Comme @simon_weaver a dit que vous pouvez avoir une classe mère comme:

export class BaseComponent implements OnDestroy {
  protected subscriptions: Subscription[] = [];

  ngOnDestroy(): void {
    this.subscriptions.filter(sub => !!sub).forEach(subscription => {
      subscription.unsubscribe();
    });
  }
}

Au lieu d'ajouter Ngondestroy à chaque enfant, vous pouvez le faire:

/* tslint:disable */
@Directive()
export class BaseComponent implements OnDestroy {
  protected subscriptions: Subscription[] = [];

  ngOnDestroy(): void {
    this.subscriptions.filter(sub => !!sub).forEach(subscription => {
      subscription.unsubscribe();
    });
  }
}
0
Logan Wlv