2016-03-23 29 views
0

ich so tue:Angular2, Spritzen Inhalte auch

import {testInjection} from './ts/models'; 
import {bootstrap} from 'angular2/platform/browser'; 

bootstrap(AppComponent, [testInjection]).catch(err => console.error(err)); 

in models.ts

let TEST:string = "test"; 

export var testInjection: Array<any>=[ 
    bind(TEST).toValue(TEST) 
]; 

und dann in AppComponent:

class export AppComponent{ 
constructor(
public http: Http, 
    @Inject(TEST) TEST:string 
    ){ 

    } 
} 

aber immer diese Fehlermeldung: Fehler TS2304 : Der Name 'TEST' kann nicht gefunden werden. Könnte mir jemand nur zeigen, was ich falsch mache.

tnx

Antwort

0

Sie sind in der falschen Weise zu tun, machen Sie einen Dienst

import { Injectable } from '@angular/core'; 

import { testInjection } from './models'; 

@Injectable() 
export class TestService { 
    getTestValue() { 
    return testInjection; 
    } 
} 

Und in Ihrem AppComponent

import {TestService} from './test.service' 
class export AppComponent{ 
constructor(
public http: Http, _testService : TestService){ 
    console.log(_testService.getTestValue()); 
    } 
} 

In Angular2 brauchen Sie nur @Injecatable, und es sollte verwenden im Dienst verwendet werden. Und in der Komponente musst du nur DI :). hoffe, es hilft Ihnen

0

Sie versuchen, modal für Ihren Code zu verwenden, nur für die Typprüfung, wenn Sie, wie Sie in Frage verwendet, verwenden Sie brauchen nicht zu verwenden @inject,

besseren Weg Erstellen Sie einen einzelnen Dienst, in dem Sie Typen prüfen, Methoden aufrufen und tun können, was Sie wollen. Wenn Sie jetzt einen Dienst erstellen möchten, müssen Sie mindestens einen Dekorator bereitstellen, entweder @Component oder Sie können @Injectable verwenden. so -

import { Injectable } from './@angular/core'; 

@Injectable() 
export class TestService { 
    name:string =null; 
    email:string =null; 
.../// 
    constructor(){ 
    //do your stuff 
    } 
} 

oder Sie können dies auch so verwenden -

import { Component } from './@angular/core'; 

    @Component({ 
     selector: 'testService' 
    }) 
    export class TestService { 
     name:string =null; 
     email:string =null; 
    .../// 
     constructor(){ 
     //do your stuff 
     } 
    } 

PS: - It is necessary to decorate class with at least one decorator

nun Damit haben Sie erfolgreich eine Klasse erstellen, jetzt, wenn diese Klasse in mehreren Komponenten verwendet wird, jetzt

bootstrap(AppComponent, [TestService]).catch(err => console.error(err)); 

wenn Sie Ihren Dienst während Bootstrap injizieren, - man kann dies wie dies zum Zeitpunkt der Bootstrap injizieren Sie müssen dies nicht jedes Mal in der Liste der Anbieter angeben, weil angular automatisch Instanz dieses Dienstes für jede Komponente erstellen,

Aber wenn Sie nicht Ihren Dienst injizieren, während Bootstrap als Sie Ihren Dienst importieren müssen und auch benötigen in der Liste der Anbieter zu injizieren, als Sie in der Lage sind, es so zu verwenden: -

import { Component } from './@angular/core'; 
import { TestService } from './TestService';  

    @Component({ 
     selector: 'testService', 
     providers: [TestService] 
    }) 
    export class AppComponent { 
     constructor(private service : TestService){ 
     this.service.blabla //now you are able to use your service here 
     } 
    } 

Hope this man einige Punkte in Bezug auf Injection in Angular2 löschen.