title: AngularJS 2 Typescript interface
body: <p>I have a service for handling users operations and an interface for the user object.</p>
  
  <p>user.service.ts</p>
  
  <pre><code>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;
    }
  }
  </code></pre>
  
  <p>In my login component I try to set the user with the profile returned from the login service but I get this error:</p>
  
  <blockquote>
    <p>Property 'firstName' does not exist on type '{}'.</p>
  </blockquote>
  
  <p>login.component.ts</p>
  
  <pre><code>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(() =&gt; this.linkedinService.getMe()
        .then(profile =&gt; this.userService.setUser({ name: profile.firstName })));
    }
  }
  </code></pre>
  
  <p>linkedin.service.ts</p>
  
  <pre><code>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) =&gt; {
        IN.User.authorize(() =&gt; resolve());
      });
    }
  
    getMe() {
      return new Promise((resolve, reject) =&gt; {
        IN.API.Profile('me').result((profile) =&gt; resolve(profile.values[0]));
      });
    }
  }
  </code></pre>
  
  <p>I'm trying to import the User interface from UserService and use inside the LoginComponent but I don't know what I'm doing wrong. Any idea? I am not sure if I have to use the User interface inside the LoginComponent, is that right?</p>