0

I am learning Angular2 routing. I imported RouterModule in app.module.ts and am getting this error immediately. I tried to fix by following online help. I am not is it because AngularRouting conflicting with .NET routing. Can anybody help on this?

enter image description here

import { NgModule } from '@angular/core';
import { enableProdMode } from '@angular/core';
import { BrowserModule } from '@angular/platform-browser';
import { HttpModule } from '@angular/http';
import { FormsModule } from '@angular/forms';
import { RouterModule } from "@angular/router";

import { AppComponent } from './app.component';
import { MapComponent } from './map/map.component';
import { VehicleComponent } from './vehicle/vehicle.component';
import { StarComponent } from './Shared/star.component';

enableProdMode();

@NgModule({
    imports: [BrowserModule, HttpModule, FormsModule, RouterModule.forRoot([
        { path: 'vehicledetails', component: VehicleComponent },
        { path: '', redirectTo: 'vehicleDetails', pathMatch: 'full' },
        {path: '**', redirectTo: 'vehicleDetails', pathMatch: 'full' }
    ])],
    declarations: [VehicleComponent, MapComponent, AppComponent, StarComponent],
    bootstrap: [MapComponent]
})

export class AppModule { }

systemjs.config.js:

/**
 * System configuration for Angular 2 samples
 * Adjust as necessary for your application needs.
 */
(function(global) {

  // map tells the System loader where to look for things
  var map = {
    'app':                        '/app', // 'dist',

    '@angular':                   '/node_modules/@angular',
    'angular2-in-memory-web-api': '/node_modules/angular2-in-memory-web-api',
    'rxjs':                       '/node_modules/rxjs'
  };

  // packages tells the System loader how to load when no filename and/or no extension
  var packages = {
    'app':                        { main: 'main.js',  defaultExtension: 'ts' },
    'rxjs':                       { defaultExtension: 'ts' },
    'angular2-in-memory-web-api': { main: 'index.js', defaultExtension: 'ts' },
  };

  var ngPackageNames = [
    'common',
    'compiler',
    'core',
    'forms',
    'http',
    'platform-browser',
    'platform-browser-dynamic',
    'router',
    'router-deprecated',
    'upgrade',
  ];

  // Individual files (~300 requests):
  function packIndex(pkgName) {
    packages['@angular/'+pkgName] = { main: 'index.js', defaultExtension: 'js' };
  }

  // Bundled (~40 requests):
  function packUmd(pkgName) {
    packages['@angular/'+pkgName] = { main: '/bundles/' + pkgName + '.umd.js', defaultExtension: 'js' };
  }

  // Most environments should use UMD; some (Karma) need the individual index files
  var setPackageConfig = System.packageWithIndex ? packIndex : packUmd;

  // Add package entries for angular packages
  ngPackageNames.forEach(setPackageConfig);

  // No umd for router yet
  packages['@angular/router'] = { main: 'index.js', defaultExtension: 'js' };

  var config = {
    map: map,
    packages: packages
  };

  System.config(config);

})(this);
user812786
  • 4,302
  • 5
  • 38
  • 50
  • Possible duplicate of [Angular2: error at startup of the app "http://localhost:3000/traceur 404 (Not Found)"](http://stackoverflow.com/questions/37179236/angular2-error-at-startup-of-the-app-http-localhost3000-traceur-404-not-fo) – SeleM Dec 22 '16 at 17:06
  • I tried all the of these solutions in the link but they are not able resolve the issue. – UdayNariseti Dec 22 '16 at 18:52

0 Answers0