AngularJS 2 Typoskript-Schnittstelle

Habe ich einen Dienst für die Handhabung von Benutzer-Operationen und eine Schnittstelle für das user-Objekt.

Benutzer.service.ts

import {Injectable} from 'angular2/core';

export interface User {
  name: string;
  email?: string;
  picture?: string;
}

@Injectable()
export class UserService {
  me: User;

  constructor() {

  }

  setUser(user: User) {
    this.me = user;
  }
}

In meinem login-Komponente, die ich versuchen, um den Benutzer mit dem Profil zurückgegeben, die von der login-Dienst, aber ich bekomme diese Fehlermeldung:

Eigenschaft 'Vorname' existiert nicht auf den Typ '{}'.

import {Component} from 'angular2/core';

import {User, UserService} from './services/user.service';
import {LinkedinService} from './services/linkedin.service';

declare const IN: any;

console.log('`Login` component loaded asynchronously');

@Component({
  selector: 'Login',
  providers: [
    UserService,
    LinkedinService
  ],
  template: require('./login.html')
})
export class LoginComponent {
  me: User;

  constructor(public linkedinService: LinkedinService, public userService: UserService) {
    this.me = userService.me;
  }

  ngOnInit() {
    console.log('hello `Login` component');
  }

  login() {
    this.linkedinService.login()
      .then(() => this.linkedinService.getMe()
      .then(profile => this.userService.setUser({ name: profile.firstName })));
  }
}

linkedin.service.ts

import {Injectable} from 'angular2/core';

declare const IN: any;

@Injectable()
export class LinkedinService {
  constructor() {
    IN.init({
      api_key: 'xxxxxxxxxxx',
      authorize: true
    });
  }

  login() {
    return new Promise((resolve, reject) => {
      IN.User.authorize(() => resolve());
    });
  }

  getMe() {
    return new Promise((resolve, reject) => {
      IN.API.Profile('me').result((profile) => resolve(profile.values[0]));
    });
  }
}

Ich versuche zu importieren, die Benutzeroberfläche von UserService und-Nutzung innerhalb der LoginComponent aber ich weiß nicht, was ich falsch mache. Irgendeine Idee? Ich bin nicht sicher, ob ich das User-interface innerhalb der LoginComponent, ist das richtig?

Ein Hinweis: Wenn das Ihre echte api_key ist, sollten Sie es entfernen. Zweitens, in Ihrem großen Pfeil-Anweisung, führen Sie eine console.log(profile) so können Sie sicherstellen, dass firstName ist eine Eigenschaft des zurückgegebenen Objekts. Schreiben Sie mehrere Anweisungen durch hinzufügen von geschweiften Klammern in Ihrem statment: .then(profile => { console.log(profile); this.userService.setUser({name: profile.firstName}); });

InformationsquelleAutor | 2016-03-08

1

Eng auf den code :
```
  .then(() => this.linkedinService.getMe())
  .then(profile => this.userService.setUser({ name: profile.firstName })));
```
Den Typ der profile angetrieben durch die Reaktion von this.linkedinService.getMe(). Wie es scheint, ist so etwas wie Promise<{}>. Es muss nicht Mitglied firstName. Daher der Fehler:
```
Property 'firstName' does not exist on type '{}'.
```
Fix

Überprüfen, um den code /Signaturen linkedinService. Das hat nichts zu tun mit der user.service.ts - Datei, die die Frage enthält ?

Update

Fokus auf den code:
```
 getMe() {
    return new Promise((resolve, reject) => {
      IN.API.Profile('me').result((profile) => resolve(profile.values[0]));
    });
  }
```
Den Wert, der zurückgegeben wird angetrieben von dem, was weitergegeben werden resolve. So stellen Sie sicher, dass profile.values[0] hat den richtigen Typ. Alternativ bieten dem Hinweis an den compiler:
```
 getMe() {
    return new Promise<{firstName:string}>((resolve, reject) => {
      IN.API.Profile('me').result((profile) => resolve(profile.values[0]));
    });
  }
```
Ich habe es, aber konnte nicht lösen. Ich aktualisiert meine Frage mit der user.service.ts - Datei.
siehe update

InformationsquelleAutor basarat

Schreibe einen Kommentar

Du musst angemeldet sein, um einen Kommentar abzugeben.

Fix

Update