IdentifiantMot de passe
Loading...
Mot de passe oublié ?Je m'inscris ! (gratuit)
Navigation

Inscrivez-vous gratuitement
pour pouvoir participer, suivre les réponses en temps réel, voter pour les messages, poser vos propres questions et recevoir la newsletter

Angular Discussion :

Chemins relatifs dans le fichier index_angular.html


Sujet :

Angular

  1. #21
    Membre éprouvé
    Homme Profil pro
    Développeur Web
    Inscrit en
    janvier 2019
    Messages
    707
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Âge : 40
    Localisation : France, Paris (Île de France)

    Informations professionnelles :
    Activité : Développeur Web
    Secteur : High Tech - Éditeur de logiciels

    Informations forums :
    Inscription : janvier 2019
    Messages : 707
    Points : 1 030
    Points
    1 030
    Par défaut
    est ce que tu as mis ça ?

    Code : Sélectionner tout - Visualiser dans une fenêtre à part
    entryComponents: [ButtonToggleMatComponent]
    dans app.module ?


    le mode stricte c'est pour forcer à initialiser les propriétés car c'est une bonne pratique
    si on ne veut pas initialiser alors on met ! pour dire que la propriété est autorisé à être de type 'undefined'

  2. #22
    Membre averti
    Homme Profil pro
    Développeur .NET
    Inscrit en
    juin 2014
    Messages
    703
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Âge : 56
    Localisation : France, Var (Provence Alpes Côte d'Azur)

    Informations professionnelles :
    Activité : Développeur .NET

    Informations forums :
    Inscription : juin 2014
    Messages : 703
    Points : 321
    Points
    321
    Par défaut
    Bonjour.

    oui, mais j'ai toujours les 2 mêmes erreurs :
    Code : Sélectionner tout - Visualiser dans une fenêtre à part
    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    13
    14
    15
    16
    17
    18
    19
    20
    21
    22
    23
    24
    25
    26
    27
    28
    29
    30
    31
    32
    33
    34
    35
    36
    37
    import { BrowserModule } from '@angular/platform-browser';
    import { NgModule, CUSTOM_ELEMENTS_SCHEMA } from '@angular/core';
    import  { Injector } from '@angular/core';
    import  { createCustomElement } from '@angular/elements';
    import { HttpClientModule } from '@angular/common/http';
    import { FormsModule } from  '@angular/forms';
     
    import { AppRoutingModule } from './app-routing.module';
    import { AppComponent } from './app.component';
    import { SortiesComponent } from './sorties/sorties.component';
    import { NavbarComponent } from './navbar/navbar.component';
    import { ApiSortiesService } from 'services/api.sorties.service';
    import { SortieTriablesComponent } from './sortie-triables/sortie-triables.component';
    import { Routes, RouterModule } from '@angular/router';
     
    const appRoutes: Routes = [
      { path: 'sorties', component: SortiesComponent },
      { path: 'sortiestriables', component: SortieTriablesComponent }
     
    ];
     
    @NgModule({
      declarations: [AppComponent, ],
      imports: [ BrowserModule,  ],
      //20220607 entryComponents : [ AppComponent, ],  
      entryComponents: [ButtonToggleMatComponent, AppComponent, ],
      providers: [  ],                                
      schemas: [ CUSTOM_ELEMENTS_SCHEMA, ],                        
    })
    export class AppModule {
      constructor(private injector : Injector) {}                  
     
      ngDoBootstrap(){
        const el = createCustomElement(ButtonToggleMatComponent, {injector : this.injector});
        customElements.define('angular', el);           
      }
    }
    J'ai essayé aussi avec
    Code : Sélectionner tout - Visualiser dans une fenêtre à part
    entryComponents: [ButtonToggleMatComponent]
    seul.

  3. #23
    Membre averti
    Homme Profil pro
    Développeur .NET
    Inscrit en
    juin 2014
    Messages
    703
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Âge : 56
    Localisation : France, Var (Provence Alpes Côte d'Azur)

    Informations professionnelles :
    Activité : Développeur .NET

    Informations forums :
    Inscription : juin 2014
    Messages : 703
    Points : 321
    Points
    321
    Par défaut
    Bon, j'ai réglé la première erreur : error TS2322: Type 'null' is not assignable to type
    Code : Sélectionner tout - Visualiser dans une fenêtre à part
    1
    2
    3
    4
    5
    export  interface  Sortie {
      date: number | null;
      chrono:  number | null;
      itineraire:  string | null;
    }
    Il me reste l'erreur error TS2304: Cannot find name 'ButtonToggleMatComponent'

  4. #24
    Membre averti
    Homme Profil pro
    Développeur .NET
    Inscrit en
    juin 2014
    Messages
    703
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Âge : 56
    Localisation : France, Var (Provence Alpes Côte d'Azur)

    Informations professionnelles :
    Activité : Développeur .NET

    Informations forums :
    Inscription : juin 2014
    Messages : 703
    Points : 321
    Points
    321
    Par défaut
    Je ne comprends pas ce qui cloche dans ces 2 lignes : error TS2304: Cannot find name 'ButtonToggleMatComponent'
    Code : Sélectionner tout - Visualiser dans une fenêtre à part
    1
    2
      entryComponents: [ButtonToggleMatComponent, ],
        const el = createCustomElement(ButtonToggleMatComponent, {injector : this.injector});


    Code : Sélectionner tout - Visualiser dans une fenêtre à part
    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    13
    14
    15
    16
    17
    18
    19
    20
    21
    22
    23
    24
    25
    26
    27
    28
    29
    30
    31
    32
    33
    34
    35
    36
    37
    import { BrowserModule } from '@angular/platform-browser';
    import { NgModule, CUSTOM_ELEMENTS_SCHEMA } from '@angular/core';
    import  { Injector } from '@angular/core';
    import  { createCustomElement } from '@angular/elements';
    import { HttpClientModule } from '@angular/common/http';
    import { FormsModule } from  '@angular/forms';
     
    import { AppRoutingModule } from './app-routing.module';
    import { AppComponent } from './app.component';
    import { SortiesComponent } from './sorties/sorties.component';
    import { NavbarComponent } from './navbar/navbar.component';
    import { ApiSortiesService } from 'services/api.sorties.service';
    import { SortieTriablesComponent } from './sortie-triables/sortie-triables.component';
    import { Routes, RouterModule } from '@angular/router';
     
    const appRoutes: Routes = [
      { path: 'sorties', component: SortiesComponent },
      { path: 'sortiestriables', component: SortieTriablesComponent }
     
    ];
     
    @NgModule({
      declarations: [AppComponent, ],
      imports: [ BrowserModule,  ],
      //20220607 entryComponents : [ AppComponent, ],  
      entryComponents: [ButtonToggleMatComponent, ],
      providers: [  ],                                
      schemas: [ CUSTOM_ELEMENTS_SCHEMA, ],                        
    })
    export class AppModule {
      constructor(private injector : Injector) {}                  
     
      ngDoBootstrap(){
        const el = createCustomElement(ButtonToggleMatComponent, {injector : this.injector});
        customElements.define('angular', el);           
      }
    }

  5. #25
    Membre éprouvé
    Homme Profil pro
    Développeur Web
    Inscrit en
    janvier 2019
    Messages
    707
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Âge : 40
    Localisation : France, Paris (Île de France)

    Informations professionnelles :
    Activité : Développeur Web
    Secteur : High Tech - Éditeur de logiciels

    Informations forums :
    Inscription : janvier 2019
    Messages : 707
    Points : 1 030
    Points
    1 030
    Par défaut
    il n'y a pas de this:
    Code : Sélectionner tout - Visualiser dans une fenêtre à part
     const PopupElement = createCustomElement(PopupComponent, {injector});

    exemple:
    Code : Sélectionner tout - Visualiser dans une fenêtre à part
    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    13
    14
    15
    16
    17
    18
    19
    20
    21
    import { Component, Injector } from '@angular/core';
    import { createCustomElement } from '@angular/elements';
    import { PopupService } from './popup.service';
    import { PopupComponent } from './popup.component';
     
    @Component({
      selector: 'app-root',
      template: `
        <input #input value="Message">
        <button type="button" (click)="popup.showAsComponent(input.value)">Show as component</button>
        <button type="button" (click)="popup.showAsElement(input.value)">Show as element</button>
      `,
    })
    export class AppComponent {
      constructor(injector: Injector, public popup: PopupService) {
        // Convert `PopupComponent` to a custom element.
        const PopupElement = createCustomElement(PopupComponent, {injector});
        // Register the custom element with the browser.
        customElements.define('popup-element', PopupElement);
      }
    }
    Code : Sélectionner tout - Visualiser dans une fenêtre à part
    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    13
    14
    15
    16
    import { NgModule } from '@angular/core';
    import { BrowserModule } from '@angular/platform-browser';
    import { BrowserAnimationsModule } from '@angular/platform-browser/animations';
     
    import { AppComponent } from './app.component';
    import { PopupComponent } from './popup.component';
    import { PopupService } from './popup.service';
     
    @NgModule({
      imports: [BrowserModule, BrowserAnimationsModule],
      providers: [PopupService],
      declarations: [AppComponent, PopupComponent],
      bootstrap: [AppComponent],
    })
    export class AppModule {
    }

  6. #26
    Membre averti
    Homme Profil pro
    Développeur .NET
    Inscrit en
    juin 2014
    Messages
    703
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Âge : 56
    Localisation : France, Var (Provence Alpes Côte d'Azur)

    Informations professionnelles :
    Activité : Développeur .NET

    Informations forums :
    Inscription : juin 2014
    Messages : 703
    Points : 321
    Points
    321
    Par défaut
    Bonjour.

    Je n'ai pas du comprendre.

    Code : Sélectionner tout - Visualiser dans une fenêtre à part
    const el = createCustomElement(ButtonToggleMatComponent, {injector});
    donne :

    Error: src/app/app.module.ts:26:21 - error TS2304: Cannot find name 'ButtonToggleMatComponent'.

    26 entryComponents: [ButtonToggleMatComponent, ],
    ~~~~~~~~~~~~~~~~~~~~~~~~


    Error: src/app/app.module.ts:35:33 - error TS2304: Cannot find name 'ButtonToggleMatComponent'.

    35 const el = createCustomElement(ButtonToggleMatComponent, {injector});
    ~~~~~~~~~~~~~~~~~~~~~~~~


    Error: src/app/app.module.ts:35:60 - error TS2663: Cannot find name 'injector'. Did you mean the instance member 'this.injector'?

    35 const el = createCustomElement(ButtonToggleMatComponent, {injector});

  7. #27
    Membre éprouvé
    Homme Profil pro
    Développeur Web
    Inscrit en
    janvier 2019
    Messages
    707
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Âge : 40
    Localisation : France, Paris (Île de France)

    Informations professionnelles :
    Activité : Développeur Web
    Secteur : High Tech - Éditeur de logiciels

    Informations forums :
    Inscription : janvier 2019
    Messages : 707
    Points : 1 030
    Points
    1 030
    Par défaut
    tu as bien fait l'importation de ButtonToggleMatComponent ?

  8. #28
    Membre averti
    Homme Profil pro
    Développeur .NET
    Inscrit en
    juin 2014
    Messages
    703
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Âge : 56
    Localisation : France, Var (Provence Alpes Côte d'Azur)

    Informations professionnelles :
    Activité : Développeur .NET

    Informations forums :
    Inscription : juin 2014
    Messages : 703
    Points : 321
    Points
    321
    Par défaut
    Je ne sais pas...

  9. #29
    Membre émérite
    Avatar de dukoid
    Homme Profil pro
    Développeur informatique
    Inscrit en
    novembre 2012
    Messages
    2 077
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Localisation : France

    Informations professionnelles :
    Activité : Développeur informatique

    Informations forums :
    Inscription : novembre 2012
    Messages : 2 077
    Points : 2 965
    Points
    2 965
    Par défaut
    dans app.module

    Code : Sélectionner tout - Visualiser dans une fenêtre à part
    import {ButtonToggleMatComponent} from .......................................

  10. #30
    Membre averti
    Homme Profil pro
    Développeur .NET
    Inscrit en
    juin 2014
    Messages
    703
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Âge : 56
    Localisation : France, Var (Provence Alpes Côte d'Azur)

    Informations professionnelles :
    Activité : Développeur .NET

    Informations forums :
    Inscription : juin 2014
    Messages : 703
    Points : 321
    Points
    321
    Par défaut
    Ben, justement.

    C'est le from dont je doute.

    j'ai essayé
    Code : Sélectionner tout - Visualiser dans une fenêtre à part
    import { MatButtonToggleModule } from '@angular/material/button-toggle';
    qui me donne
    Error: src/app/app.module.ts:7:39 - error TS2307: Cannot find module '@angular/material/button-toggle' or its corresponding type declarations.

    7 import { MatButtonToggleModule } from '@angular/material/button-toggle';
    Parceque est dans la 13.3.6 et que j'ai Angular CLI: 13.3.5.

    J'ai un soucis pour charger ces librairies :
    npm install --save @angular/material
    npm ERR! code E407
    npm ERR! 407 authenticationrequired - GET https://registry.npmjs.org/@angular%2fmaterial

    npm ERR! A complete log of this run can be found in:
    npm ERR! C:\Users\Zare6363\AppData\Local\npm-cache\_logs\2022-05-08T07_39_25_492Z-debug-0.log

  11. #31
    Membre éprouvé
    Homme Profil pro
    Développeur Web
    Inscrit en
    janvier 2019
    Messages
    707
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Âge : 40
    Localisation : France, Paris (Île de France)

    Informations professionnelles :
    Activité : Développeur Web
    Secteur : High Tech - Éditeur de logiciels

    Informations forums :
    Inscription : janvier 2019
    Messages : 707
    Points : 1 030
    Points
    1 030
    Par défaut
    Code : Sélectionner tout - Visualiser dans une fenêtre à part
    1
    2
    3
    npm remove @angular/material
     
    ng add @angular/material

Discussions similaires

  1. Chemin relatif sur un fichier dans un service web
    Par Yoteco dans le forum Services Web
    Réponses: 0
    Dernier message: 07/01/2011, 13h40
  2. Réponses: 2
    Dernier message: 01/12/2009, 14h35
  3. Réponses: 18
    Dernier message: 08/10/2009, 15h22
  4. chemin relatif d'un fichier présent dans le war
    Par Saverok dans le forum Websphere
    Réponses: 1
    Dernier message: 05/11/2008, 10h56
  5. rassembler des ressources dans ub fichier xml/html
    Par cbonnard dans le forum XML/XSL et SOAP
    Réponses: 2
    Dernier message: 09/01/2006, 17h18

Partager

Partager
  • Envoyer la discussion sur Viadeo
  • Envoyer la discussion sur Twitter
  • Envoyer la discussion sur Google
  • Envoyer la discussion sur Facebook
  • Envoyer la discussion sur Digg
  • Envoyer la discussion sur Delicious
  • Envoyer la discussion sur MySpace
  • Envoyer la discussion sur Yahoo