Angular4: comment faire de l'accès local json?

Dans Angular2 vous pourriez avoir un dossier /data/et un fichier json et vous accès à localhost:4200/data/quelque chose.json.

Ce n'est plus possible dans Angular4.

Tout ideea comment le faire fonctionner?

angular4 ??? qu'est ce qu'il n'a jamais entendu parler de lui
voir ici ce qui est angular2 maintenant stackoverflow.com/a/43224781/5043867 😉
cool ! merci pour l'information,

OriginalL'auteur Dan Neciu | 2017-04-07

  1. 10

    vous pouvez utiliser ce code

    @Injectable()
export class AppServices{

    constructor(private http: Http) {
         var obj;
         this.getJSON().subscribe(data => obj=data, error => console.log(error));
    }

    public getJSON(): Observable<any> {
         return this.http.get("./file.json")
                         .map((res:any) => res.json())
                         .catch((error:any) => console.log(error));

     }
}

    ici file.json de votre région fichier json.

    voir ici aussi

    également voir le changlog angulaires-cli pour le chemin

    C'est ce que j'ai l'habitude de faire dans Angular2. Dans Angular4 de la route ./fichier.json ne fonctionne plus.
    quelle est l'erreur que vous rencontrez ?
    voir aussi mon Jour de réponse
    c'est pourquoi les cadres sucer, tout cela juste pour ouvrir un fichier, il peut être plus facile de le faire avec le code réel de l'interfaçage avec le système de fichier lui-même
    importation * que les données de". /exemple.json"; ou en vous abonnant .json à partir d'actifs locaux qui est préférée et pourquoi s'abonner si on peut importer directement?

    OriginalL'auteur Pardeep Jain

  2. 9

    Bien sûr possible. Admettons ici est votre fichier json

    Angular4: comment faire de l'accès local json?


    Et voici votre code pour appeler le json 

    import { Injectable } from '@angular/core';
import { Http, Headers, Response } from '@angular/http';
import { Observable } from 'rxjs';
import 'rxjs/add/operator/map'

@Injectable()
export class YourService {

   constructor(private http: Http) { }

   getAdvantageData(){
      let apiUrl = './assets/data/api/advantage.json';
      return this.http.get(apiUrl)
      .map( (response: Response) => {
         const data = response.json();
         return data;
      });
   }  
}
    Ce module doit être importé dans l'application du module après cela?
    Je n'ai pas votre question complètement. Merci de développer un peu.

    OriginalL'auteur Vivek Shukla

  3. 7

    J'ai été confrontée au même problème, d'où mon Observables Angulaire de service est situé à l'intérieur de 'src/app/dossier et qu'il était en train de charger un local fichier JSON. J'ai essayé de mettre le fichier JSON à l'intérieur du même dossier app, à l'intérieur d'un nouveau " api " le dossier, a utilisé divers types de famille/absolue routes, mais cela n'aide pas, et j'ai l'erreur 404. Le moment où je l'ai mis à l'intérieur des actifs dossier... BAM!!! il a travaillé. Je suppose qu'il est plus...

    Peut-être ce lien permet de...

    COMPOSANT LES CHEMINS RELATIFS ANGULAIRE

    Il fonctionne! mais pourquoi?
    Je pense que webpack, le module de bundler, des paquets par défaut tout à partir d'éléments de dossier.
    C'est à cause de tout ce qui est précisé dans le assets tableau dans angular-cli.json est copié et servi, donc, à être disponible dans le runtime. Voir github.com/angular/angular-cli/wiki/stories-asset-configuration

    OriginalL'auteur Deepak Pathak

  4. 7

    Vous pouvez utiliser "l'exigent" trop;

    let test = require('./test.json');
    merci pour votre réponse

    OriginalL'auteur yazantahhan

  5. 3

    Sur cette base post, ici est la réponse complète Angulaire 6+:

    De angulaires-cli doc, json peuvent être considérés comme des actifs et accessibles à partir d'importation standard sans utiliser de requête ajax.

    Supposons que vous ajoutez vos fichiers json dans "votre-json-dir répertoire":

    1. ajouter "votre-json-dir" dans angulaire.fichier json (:

      "assets": [
      "src/assets",
      "src/your-json-dir"
      ]

    2. autoriser l'importation de json modules dans typings.d.ts fichier pour éviter de tapuscrit erreurs:

      declare module "*.json" {
      const value: any;
      export default value;
      }

    3. dans votre contrôleur de service et/ou tout autre fichier, il vous suffit d'importer le fichier à l'aide de ce chemin d'accès relatif:

      import * as myJson from 'your-json-dir/your-json-file.json';

    OriginalL'auteur Benjamin Caure

  6. 0

    J'ai tout compris.

    Dans Angular2 j'ai eu le dossier dans le répertoire src.
    Dans Angular4 vous devez l'avoir dans le dossier racine.

    Exemple:

    Angular2:

    root /src /données /fichier.json

    Angular4:

    root /data /file.json

    Vous pouvez placer le fichier où vous le souhaitez, tout comme vous utilisez le chemin d'accès complet, pas les chemins d'accès relatifs à votre demande 🙂

    OriginalL'auteur Dan Neciu

  7. 0

    Vous pouvez ajouter votre emplacement de dossier à l'Actif de la balise angulaire.json

    "assets": [
          "src/favicon.ico",
          "src/assets",
          "src/api"
        ],

    OriginalL'auteur deathrace