AngularJS2: Erste 404 nicht in den Modellen gefunden Ordner obwohl Datei ist es

Question

Ich habe folgende App Struktur:

ich meine Bewerbung wollen, wo jede Seite wie „Create.cshtml“ wird

Bootstrap (Scripts/app/Projekt/create/app.projects.create-boot.ts) und Last der Anwendung (/app.projects.create.ts).

Ich habe auch einen Modellordner, der alle meine Modelle enthält und geteilt wird.

serviceline.js (Scripts/Modelle/serviceline.ts)

app.projects.create-boot.ts:

/// <reference path="../../../../node_modules/angular2/typings/browser.d.ts" /> 
import {bootstrap} from 'angular2/platform/browser' 
import {AppProjectsCreateComponent} from './app.projects.create' 
import {ServiceLine} from '../../../models/serviceline'; 
bootstrap(AppProjectsCreateComponent, [ServiceLine]); 

app.projects.create.ts:

import {Component} from 'angular2/core'; 
import {ServiceLine} from '../../../models/serviceline'; 

@Component({ 
    selector: 'project-create', 
    templateUrl: '../../appScripts/app/projects/create/app.projects.create.html' 
}) 
export class AppProjectsCreateComponent { 
    name = "max"; 
    serviceLines: ServiceLine[]; 
    constructor() { 
     //this.serviceLines = [ new ServiceLine(1, "Name Test") ]; 
    } 
} 

serviceLine.ts

export class ServiceLine { 
    ServiceLineId: number; 
    Name: string 

    constructor(serviceLineId: number, name: string) { 
     this.ServiceLineId = serviceLineId; 
     this.Name = name; 
    } 
} 

Create.cshtml:

@* 
    For more information on enabling MVC for empty projects, visit http://go.microsoft.com/fwlink/?LinkID=397860 
*@ 
@section head{ 
    <script src="~/lib/es6-shim.min.js"></script> 
    <script src="~/lib/system-polyfills.js"></script> 
    <script src="~/lib/shims_for_IE.js"></script> 
    <script src="~/lib/angular2-polyfills.js"></script> 
    <script src="~/lib/system.js"></script> 
    <script src="~/lib/rx.js"></script> 
    <script src="~/lib/angular2.dev.js"></script> 
    <!-- 2. Configure SystemJS -->  
} 

@{ 
    <script> 
     System.config({ 
      map: { 
       appScripts: '../appScripts/app/projects/create' 
      }, 
      packages: { 
       appScripts: { 
        defaultExtension: 'js' 
       } 
      } 
     }); 

     System.import('appScripts/app.projects.create-boot') 
       .then(null, console.error.bind(console)); 
    </script> 
} 
<br /> 
<project-create></project-create> 

Alles Laden finden, bis ich Serviceline [] in den app.projects.create.ts Datei hinzugefügt. Hier

ist der Fehler:

Was bin ich? Warum kann Angular die serviceLine.js nicht finden?

Bearbeiten: Ändern Sie das Kartenfeld.

<script> 
     System.config({ 
      map: { 
       appScripts: '../appScripts' //Change Here 
      }, 
      packages: { 
       appScripts: { 
        defaultExtension: 'js' 
       } 
      } 
     }); 

     System.import('appScripts/app/projects/create/app.projects.create-boot') //Change Here 
       .then(null, console.error.bind(console)); 
    </script> 

Answer 1

Das Problem ist, dass Ihre Service-Datei nicht mit Ihrer SystemJS Konfiguration, da der Kartenblock abgezielt wird.

Also SystemJS die JS-Erweiterung nicht anhängen. Ich würde die Karte Block entfernen:

<script> 
     System.config({ 
      /* map: { 
       appScripts: '../appScripts/app/projects/create' 
      }, */ 
      packages: { 
       appScripts: { 
        defaultExtension: 'js' 
       } 
      } 
     }); 

     System.import('appScripts/app/projects/create/app.projects.create-boot') 
       .then(null, console.error.bind(console)); 
    </script> 

und entsprechend den Pfad in Ihren Importen aktualisieren.

Mit dieser Konfiguration wird das "Modell" berücksichtigt. Ihre Konfiguration würde nur funktionieren, wenn Ihr "Modell" -Ordner unter dem "Erstellen" -Ordner war.