web-dev-qa-db-fra.com

Angular2 - Aucun fournisseur pour TemplateRef (ng2-bootstrap)

J'ai essayé plusieurs solutios pour cette erreur, mais je n'ai trouvé aucun moyen de surmonter cela: Pas de fournisseur pour TemplateRef!

Journal des erreurs:

EXCEPTION: Uncaught (promis): Erreur: Erreur dans la classe ./FooterComponent FooterComponent - modèle en ligne: 15: 20 provoqué par: Aucun fournisseur pour TemplateRef! Erreur: Erreur dans la classe ./FooterComponent FooterComponent - modèle en ligne: 15: 20 provoqué par: Aucun fournisseur pour TemplateRef!

Rejet de promesse non géré: erreur dans la classe ./FooterComponent FooterComponent - modèle en ligne: 15: 20 provoqué par: Aucun fournisseur pour TemplateRef! ; Zone: angular; Tâche: Promise.then; Valeur:

footer.component.ts

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

@Component({
  selector: 'sa-footer',
  templateUrl: './footer.component.html'
})
export class FooterComponent implements OnInit {

  constructor() {}

  ngOnInit() {}

}

footer.component.html

<div class="page-footer">
    <div class="row">
        <div class="col-xs-12 col-sm-6">
            <span class="txt-color-white">myAPP © 2016</span>
        </div>

        <div class="col-xs-6 col-sm-6 text-right hidden-xs">
            <div class="txt-color-white inline-block">
                <i class="txt-color-blueLight hidden-mobile">Last account activity <i class="fa fa-clock-o"></i>
                    <strong>52 mins ago &nbsp;</strong> </i>

                <div class="btn-group dropup" dropdown>
                    <button class="btn btn-xs dropdown-toggle bg-color-blue txt-color-white" dropdownToggle>
                        <i class="fa fa-link"></i> <span class="caret"></span>
                    </button>
                    <ul class="dropdown-menu pull-right text-left" dropdownMenu>
                        <li>
                            <div class="padding-5">
                                <p class="txt-color-darken font-sm no-margin">Download Progress</p>

                                <div class="progress progress-micro no-margin">
                                    <div class="progress-bar progress-bar-success" style="width: 50%;"></div>
                                </div>
                            </div>
                        </li>
                        <li class="divider"></li>
                        <li>
                            <div class="padding-5">
                                <p class="txt-color-darken font-sm no-margin">Server Load</p>

                                <div class="progress progress-micro no-margin">
                                    <div class="progress-bar progress-bar-success" style="width: 20%;"></div>
                                </div>
                            </div>
                        </li>
                        <li class="divider"></li>
                        <li>
                            <div class="padding-5">
                                <p class="txt-color-darken font-sm no-margin">Memory Load <span class="text-danger">*critical*</span>
                                </p>

                                <div class="progress progress-micro no-margin">
                                    <div class="progress-bar progress-bar-danger" style="width: 70%;"></div>
                                </div>
                            </div>
                        </li>
                        <li class="divider"></li>
                        <li>
                            <div class="padding-5">
                                <button class="btn btn-block btn-default">refresh</button>
                            </div>
                        </li>
                    </ul>
                </div>
            </div>
        </div>
    </div>
</div>

J'ai essayé de faire ce qui suit:

  1. Recherche : Mais seulement trouvé des réponses/solutions pour les modèles qui contiennent en fait des directives comme ngIf, ngSwitch, etc. (Oubliant le *, par exemple)

  2. Ajoutez TemplateRef à providers. Voici ce que j'obtiens:

Argument de type '{selector: string; templateUrl: chaîne; fournisseurs: typeof TemplateRef []; } 'n'est pas assignable au paramètre de type' Component '. Les types de "fournisseurs" de propriétés sont incompatibles. Le type 'typeof TemplateRef []' n'est pas attribuable au type 'Provider []'. Le type 'typeof TemplateRef' n'est pas assignable au type 'Provider'. Le type "typeof TemplateRef" n'est pas attribuable au type "FactoryProvider". La propriété "provide" est manquante dans le type "typeof TemplateRef".

Je vais essayer de voir comment ajouter en quelque sorte TemplateRef au module de l'application providers. Mais je ne sais pas si c'est la solution. J'espère que quelqu'un sort avec une solution pendant que je continue mes recherches.

Je vous remercie! :RÉ

angulartypescriptangular-cling2-bootstrap
12
SrAxi

Recherche: Mais seulement trouvé des réponses/solutions pour les modèles qui contiennent en fait des directives comme ngIf, ngSwitch, etc. (Oublier le *, par exemple)

disparu * ici :

<ul class="dropdown-menu pull-right text-left" dropdownMenu>

devrait être

<ul class="dropdown-menu pull-right text-left" *dropdownMenu>

De ng2-bootstrap :

<div class="btn-group" dropdown>
  <button dropdownToggle type="button" class="btn btn-primary dropdown-toggle">
    Button dropdown <span class="caret"></span>
  </button>
  <ul *dropdownMenu class="dropdown-menu" role="menu">
    <li role="menuitem"><a class="dropdown-item" href="#">Action</a></li>
    <li role="menuitem"><a class="dropdown-item" href="#">Another action</a></li>
    <li role="menuitem"><a class="dropdown-item" href="#">Something else here</a></li>
    <li class="divider dropdown-divider"></li>
    <li role="menuitem"><a class="dropdown-item" href="#">Separated link</a>
    </li>
  </ul>
</div>
30
n00dl3