Angular2路由错误：未捕获（承诺）：TypeError：无法获取属性'visitExpression'

Question

我一直在努力处理这个错误，现在已经有一段时间了。经过广泛的研究，我无法找到任何其他参考。任何帮助或方向将不胜感激。我相信这个问题与我如何使用路由和auth0服务相结合。请注意，我的路由没有显示，但我的导航栏等。

编辑： 最初我是根据假设认为Auth0与这个问题有关。此后，我删除了所有Auth0组件，服务，从应用程序导入。因此，无论出于何种原因，路由根本无法工作......我更新了发布的代码，因此更易于选择投掷。

ERROR

Error: Uncaught (in promise): TypeError: Unable to get property 'visitExpression' of undefined or null reference 
(http://localhost:3000/node_modules/zone.js/dist/zone.js:538:26) at Anonymous function 

main.ts

import { bootstrap } from '@angular/platform-browser-dynamic'; 
import { AppComponent } from './app.component';  
import { appRouterProviders } from './app.routes'; 

bootstrap(AppComponent, [ appRouterProviders]); 

app.component.ts

import { Component } from '@angular/core'; 
import { HomePageHeaderComponent } from './homepageheader.component';  
import { ROUTER_DIRECTIVES, Router } from '@angular/router'; 

@Component({ 
selector: 'my-app', 
template: `<header></header><router-outlet></router-outlet>`, 
directives: [ROUTER_DIRECTIVES], 


}) 
export class AppComponent { 
} 

** app.routes.ts *

import { provideRouter, RouterConfig } from '@angular/router'; 
import { HomePageContentComponent } from './homepagecontent.component'; 
import { LoggedInComponent } from './loggedin.component'; 
import { LogoutComponent } from './logout.component'; 

const routes: RouterConfig = [ 

{ path: '', pathMatch: 'full', redirectTo: 'home' }, 
{ path: 'home', component: HomePageContentComponent }, 
{ path: 'loggedIn', component: LoggedInComponent }, 
{ path: 'loggedOut', component: LogoutComponent }, 

]; 

export const appRouterProviders = [ 
provideRouter(routes) 
]; 

Systemjs.config

(function (global) { 
// map tells the System loader where to look for things 
var map = { 
    'app': 'app/components', //'dist', 
    '@angular': 'node_modules/@angular', 
    'angular2-in-memory-web-api': 'node_modules/angular2-in-memory-web-api', 
    'rxjs': 'node_modules/rxjs', 
    'angular2-jwt': 'node_modules/angular2-jwt/angular2-jwt.js', 
}; 
// packages tells the System loader how to load when no filename and/or no extension 
var packages = { 
    'app': { main: 'main.js', defaultExtension: 'js' }, 
    'rxjs': { defaultExtension: 'js' }, 
    'angular2-in-memory-web-api': { main: 'index.js', defaultExtension: 'js' }, 



}; 
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); 
var config = { 
    map: map, 
    packages: packages 
}; 
System.config(config); 
})(this); 

的package.json

{ 
"name": "angular2-quickstart", 
"version": "1.0.0", 
"scripts": { 
"start": "tsc && concurrently \"npm run tsc:w\" \"npm run lite\" ", 
"lite": "lite-server", 
"postinstall": "typings install", 
"tsc": "tsc", 
"tsc:w": "tsc -w", 
"typings": "typings" 
}, 
"license": "ISC", 
"dependencies": { 
"@angular/common": "2.0.0-rc.4", 
"@angular/compiler": "2.0.0-rc.4", 
"@angular/core": "2.0.0-rc.4", 
"@angular/forms": "0.2.0", 
"@angular/http": "2.0.0-rc.4", 
"@angular/platform-browser": "2.0.0-rc.4", 
"@angular/platform-browser-dynamic": "2.0.0-rc.4", 
"@angular/router": "3.0.0-beta.1", 
"angular/router-deprecated": "2.0.0-rc.2", 
"angular/upgrade": "2.0.0-rc.4", 
"angular2-in-memory-web-api": "0.0.14", 
"bootstrap": "^3.3.7", 
"core-js": "^2.4.0", 
"reflect-metadata": "^0.1.3", 
"rxjs": "5.0.0-beta.6", 
"systemjs": "0.19.27", 
"zone.js": "^0.6.12" 
}, 
"devDependencies": { 
"concurrently": "^2.0.0", 
"lite-server": "^2.2.0", 
"typescript": "^1.8.10", 
"typings": "^1.3.2" 
} 
} 

Answer 1

我发现了这个问题！在我尝试路由到的其他组件中，我有空的选择器标签。例如，下面是我的路径

{ path: '', pathMatch: 'full', redirectTo: '/home' }, 
{ path: 'home', component: HomePageContentComponent }, 
{ path: 'loggedIn', component: LoggedInComponent }, 
{ path: 'loggedOut', component: LogoutComponent }, 

在我LoggedInComponent和LogoutComponent我有

selector:'', 

这是造成 'visitexpression' 的错误。所以只需从组件中删除这些问题就可以解决问题。

Answer 2

一些明显发现;-)

不要

import { ROUTER_PROVIDERS } from '@angular/router-deprecated'; 

使用进口替代

import { ROUTER_PROVIDERS } from '@angular/router'; 

您可能还需要修复您的systemjs配置。