Bootstrap-Tabs Mit Den Eckigen 2-Anwendung

Hintergrund

Ich habe mit ng2-tabs in meiner Anwendung, aber heute Abend, wenn ich versuche und ausführen bekomme ich Fehler, Klagen über einen Konflikt, der components.

Selbst wenn ich entfernen Sie alle meine code und legen Sie ein paar Zeilen der Beispiel-code von der Seite, Sie haben auf npm es immer noch wirft Fehler. Auf der Suche nach einer Lösung fand ich, dass Sie geändert NGX-Registerkarten, so dass ich aktualisiert. Dies hat nicht geholfen.

Frage

Gibt es einen Grund ngx-tabs würde brechen meine app durch eine neue Version? Ich bin nicht in der Lage, Sinn des Fehlers. Obwohl es scheint, einfach. Ich verstehe nicht, was falsch ist.

Beispiele

Fehler

Template-parsing-Fehler:↵Mehr als eine Komponente abgestimmt auf diese
element.↵Stellen Sie sicher, dass nur eine Komponente Selektor kann eine
angesichts element.↵Widersprüchliche Komponenten: TabsetComponent,Tabset ("↵ [FEHLER ->]↵ ↵

↵"):
AsideComponent@1:4"

Was ich nicht bekommen, ist, warum hält es sich über den selector. Ich bin mir nicht bewusst jede meiner Auswahlen überlappen in allen Komponenten.

Den html-Teil meiner Komponenten,

<aside class="aside-menu">
    <tabset> //error on tabset but app runs when I remove this block.
        <tab>
            <template tabHeading><i class="fa fa-list"></i>
            </template>
        </tab>
     </tabset>  //end of tabset
</aside>

Meine Komponente.ts

import { Component }            from '@angular/core';
import { Router }               from '@angular/router';
import { Auth }                 from './../services/auth.service';
import {TabsModule}             from "ngx-tabs";

@Component({
    selector: 'application-aside',
    templateUrl: './aside.component.html'
})
export class AsideComponent {
       constructor( private router: Router, private auth: Auth  ) { }

}

Ressourcen

Link zu den neuen NGX-TABS, die ich nehme an, wir sollen jetzt und beenden Sie den alten, die gefunden werden können hier - NG2-TABS

Wenn jemand hat einen input würde ich mich sehr freuen.

  • Haben Sie versucht, ng-bootstrap.github.io/#/components/tabs? Dieses Projekt hat ausgezeichnete Registerkarten Umsetzung (zusammen mit vielen anderen Komponenten!) für Eckige + Bootstrap.
  • Danke Mann werde ich check it out.
InformationsquelleAutor wuno | 2017-01-24
  1. 0

    in der app.- Modul.ts nur hinzufügen

    import { Ng2BootstrapModule } from 'ng2-bootstrap/ng2-bootstrap';

    @NgModule({

    Importe: [
    BrowserModule,
    Ng2BootstrapModule.forRoot(),..}]

    und in Ihrem Hause.Komponente.ts:
    import { TabsModule } from 'ng2-bootstrap';

    und in home.component.html :

     <div>
      <tabset>
        <tab heading="Basic title" id="tab1">Basic content</tab>
        <tab heading="Basic Title 1">Basic content 1</tab>
        <tab heading="Basic Title 2">Basic content 2</tab>
      </tabset>
    </div>

    in system.js:

     'ng2-bootstrap/ng2-bootstrap': 'node_modules/ng2-bootstrap/bundles/ngx-bootstrap.umd.js',
'moment'                    :                       'npm:ng2-bootstrap/node_modules/moment/moment',
    InformationsquelleAutor him
  2. 0

    Ich denke, es ist immer noch Bezug zu den alten ng2-Reiter in Ihrem node_modules-Ordner. Versuchen Sie das löschen der node_modules Ordner und re-installieren (npm installieren). Auch stellen Sie sicher, Sie haben Ihr Paket.json aktualisiert.

    InformationsquelleAutor Ashok
Schreibe einen Kommentar