web-dev-qa-db-fra.com

self.context n'est pas une fonction dans Angular2 lors de l'appel d'une fonction composant

Je souhaite appeler une fonction lorsque j'instancie un composant angular2, mais l'erreur suivante s'affiche: TypeError: self.context.dummyFunc n'est pas une fonction.

Ce qui suit est un exemple artificiel, mais vous montrera mon problème. Supposons que nous ayons le composant suivant:

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

    @Component({
      selector: 'myItem',
      template: `<div>This will work->{{dummyFunc()}}</div>`,
    })
    export class myItemComponent {
      constructor() { }

      dummyFunc() :string {
        return "bold";
      }
    }

Et le code HTML suivant:

<ul myItem [ngClass]='dummyFunc()'></ul>

L'exception suivante sera générée:

TypeError: self.context.dummyFunc n'est pas une fonction

Si je change le HTML en:

<ul myItem></ul>

Le composant s'exécute et peut appeler la fonction dummyFunc dans le <div>

Je suppose que dummyFunc () n'est pas appelé dans le contexte du composant myItem, mais du composant qui a instancié myItem.

Ma question. Quelle serait la bonne façon d'appeler une fonction sur le composant que vous venez de créer lors de l'instanciation d'un composant?

angularcomponents
7
ElSnakeO

En fait, lorsque vous utilisez dummyFunc sur l'élément ul, vous êtes en dehors du composant myItem. Donc, vous ne pouvez pas l'utiliser. Vous avez uniquement accès aux propriétés et aux méthodes du composant associé au modèle actuel.

Si vous souhaitez utiliser une méthode d'un composant utilisé dans ce modèle, vous devez d'abord la référencer. Vous pouvez essayer ce qui suit:

<ul #comp myItem [ngClass]="comp.dummyFunc()"></ul>
13
Thierry Templier

Le sélecteur et l'attribut doivent correspondre

selector: 'myitem',

<ul myItem

Changez le sélecteur en 'myItem' ou l'attribut en <ul myitem

0
Günter Zöchbauer