升級的角度服務無法使用角度組件：無法獲取未定義的錯誤

Question

我正在將AngularJS應用升級爲角度。 但我現在已經陷入困境。 我正在嘗試獲取角度來處理主線路，並不起作用。該錯誤似乎來自升級的服務。

當我讓angularJS處理路線，它使用相同的組件工作正常。

的App-routing.module

class HybridUrlHandlingStrategy implements UrlHandlingStrategy { 
    // use only process the `home` url 
    shouldProcessUrl(url:UrlTree) { 
    console.log(url.toString()); 
    return url.toString() === '/' || url.toString() ==='/home' ; 
    } 
    extract(url: UrlTree) { return url; } 
    merge(url: UrlTree, whole: UrlTree) { return url; } 
} 

const appRoutes: Routes = [ 
    { path: '', redirectTo: 'home', pathMatch: 'full' }, 
    { path: 'home', component: HomeComponentNg2 } 
]; 

@NgModule({ 
    imports:[ 
     RouterModule.forRoot(appRoutes) 
    ], 
    exports: [RouterModule ], 
    providers:[ 
    { provide: UrlHandlingStrategy, useClass: HybridUrlHandlingStrategy } 
    ] 
}) 

export class AppRoutingModule { } 

AJS升級-providers.ts

export function statsServiceFactory(i: any) { 
    return i.get('StatsService'); 
} 
export const StatsServiceProvider = { 
    provide: StatsService, 
    useFactory: statsServiceFactory, 
    deps: ['$injector'] 
}; 

export function authServiceFactory(i:any){ 
    return i.get('AuthService'); 
} 

export const AuthServiceProvider = { 
    provide: AuthService, 
    useFactory: authServiceFactory, 
    deps: ['$injector'] 

stats.service

export class StatsService { 
    static $inject = ['$http']; 
    constructor(private $http) { 
     this.$http = $http; 
    }; 

    getEmplStats() { 
     console.log('getEmplstats'); 
     return this.$http.get('./src/app/JSON/employeeStats.json') 
      .then(res => { 
      console.log(res); 
      return res 
     }).catch(error => { 
      console.log(error); 
     }) 
    }; 

    getCustStats() { 
     console.log('getCustStats'); 
     return this.$http.get('./src/app/JSON/customerStats.json') 
      .then(res => { 
      console.log(" getCustStats "+res); 
      return res 
     }).catch(error => { 
      console.log(error); 
     }) 
    } 
} 
export default StatsService; 

誤差

core.es5.js?0445:1084 ERROR Error: Uncaught (in promise): TypeError: Cannot read property 'get' of undefined 
TypeError: Cannot read property 'get' of undefined 
    at statsServiceFactory (eval at 327 (http://localhost:8080/app.js:653:1), <anonymous>:6:13) 
    at Ng2AppModuleInjector.get (ng:///Ng2AppModule/module.ngfactory.js:161:69) 
    at Ng2AppModuleInjector.getInternal (ng:///Ng2AppModule/module.ngfactory.js:271:52) 
    at Ng2AppModuleInjector.NgModuleInjector.get (eval at <anonymous> (http://localhost:8080/vendor.js:84:1), <anonymous>:3783:44) 
    at resolveDep (eval at <anonymous> (http://localhost:8080/vendor.js:84:1), <anonymous>:11245:45) 

我只是不明白爲什麼讓AngularJS處理路線似乎很好，但如果我讓Angular處理它，它就會崩潰。 任何幫助將apreciated

編輯：增加了客戶stats.ng2.component

@Component({ 
    selector: 'customer-stats2', 
    templateUrl: './customer-stats.ng2.component.html' 
}) 

export class CustomerStatsComponentNg2 implements OnInit{ 
    customerStats:any; 

    constructor(private ss:StatsService){ 
    } 

    ngOnInit() 
    { 
     console.log('ngoninit cust stats ') 
     this.ss.getCustStats(). 
      then(custStats => this.customerStats = custStats.data) 
      .then(error => console.log(error)) 
    } 
} 

Answer 1

我面臨着同樣的問題，而試圖升級angularjs服務和角度使用。您可以找到角碼here中引發的錯誤。

當我們他們提到，如果我們先NG1應用自舉NG2應用中，我們可能會遇到這個問題，吳會議期間採訪了角的球隊，他們建議改用引導過程做NG1先ng2將解決這個問題。我們還沒有嘗試切換引導順序，但希望這可以解決您的問題。