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

我正在將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)) 
    } 
}

來源

2017-06-01 JSB

'從'@ angular/http''導入{Http}' – anoop

不幸的是，沒有幫助。它讓我感到困惑，因爲在angularJS處理路由時它工作正常。 – JSB

您還沒有將您的服務添加到您的提供者數組中？它會盡管拋出一個不同的錯誤.... – Alex

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

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

來源

2017-06-05 18:06:36 Sri

hmm intersting。我遵循他們的指導，所以它是不正常的，它不工作。他們的指南首先發布了我的知識。我目前的解決方案是首先將te服務轉換爲角度服務，然後將它們降級爲angularJS。這並不理想，但這對我來說似乎是唯一的解決方案。 – JSB

其實我們有一個hacky解決方案，同時使用platformBrowserDynamic引導角應用程序，我們通過platformRef.injector訪問這些服務，所以在那時我們將它們附加到一個窗口對象。在我們的例子中，我們有很多ng1服務，所以在ng2中重寫不是我們的選擇。 – Sri

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

回答

相關問題