アップグレードされた角度サービスが角度コンポーネントで機能していません：未定義のエラーを取得できません

Question

AngularJSアプリケーションを角度にアップグレードする作業を進めています。 しかし、私は今立ち往生してしまった。 ホームルートを処理するために角度を取得しようとしていて、動作しません。このエラーは、アップグレードされたサービスから発生したようです。

私は、angularJSが同じコンポーネントを使ってうまく動作するルートを処理させるようにします。

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 { } 

のApp-routing.module

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がそれがうまく行くように見えるルートを処理させる理由を理解していませんが、私が角度をそれを扱わせるならば、それは崩壊します。 すべてのヘルプは

編集apreciatedされるだろう：angularjsサービスをアップグレードし、角度で使用しようとしている間、私は同じ問題に直面し、顧客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

を追加しましたが。あなたは角度コードhereで発生したバグを見つけることができます。

ng2の会議で角チームに話をしたところ、最初にng2アプリケーションをブートストラップし、次にng1アプリケーションをブートストラップすると、最初にng1を実行するようブートストラッププロセスを切り替えてから、 ng2はこの問題を解決します。スイッチングブートストラップシーケンスはまだ試していませんが、うまくいけば問題が解決します。