title: how to access objects gotten from service in the component?
body: <p>When I tried to access atoms using 'this.atoms' in the searchAtoms, it returns "TypeError: Cannot read property 'length' of undefined". I am thinking atoms are all set because *ngFor is working well. There is some hidden logic behind subscribe? If someone knows about this, could you give some clues? And, also another question, when I defined getAtoms method with a parameter, atom name value gotten from input field in the atom.service.ts like this.service.getAtoms(newAtom). But I get "A parameter proerty is only allowed in a constructor implementation". I think I can't use this way. Could you anybody recommend a desirable way for this?</p>
  
  <p>app.component.ts</p>
  
  <pre><code>import {Component} from 'angular2/core';
  import {Router} from 'angular2/router';
  import {AtomService} from './service/atom.service';
  import {Atom} from './datatype/Atom';
  
  @Component({
      selector: 'my-app',
      template: `&lt;br&gt;
      &lt;input #atomname value='atom1'&gt;
      &lt;button (click)=searchAtoms(atomname.value)&gt;Search Atoms&lt;/button&gt;  
      &lt;br&gt;&lt;br&gt;
      &lt;ul&gt;
          &lt;li *ngFor="#atom of atoms"&gt;
              {{atom.id}} - {{atom.name}}
          &lt;/li&gt;
      &lt;/ul&gt;`,
      providers: [ConceptService]
  })
  
  
  export class AppComponent {
  
      atoms: Array&lt;Atom&gt;;
  
      constructor(private service : AtomService) {
  
      }
  
      searchAtoms(newAtom: string) {
          console.log("searchAtoms\t" + newAtom);
          if (newAtom) {
              this.service.getAtoms(newAtom).subscribe(data =&gt; this.atoms = data);
              console.log(this.atoms.length);
          }
      }
  }
  </code></pre>
  
  <p>atom.service.ts</p>
  
  <pre><code>import { Injectable }     from 'angular2/core';
  import { Http, Response, URLSearchParams, Headers } from 'angular2/http';
  import 'rxjs/add/operator/map';
  import {Atom} from '../datatype/Atom';
  
  @Injectable()
  export class ConceptService {
  
    constructor(private http: Http) {
      this.http = http;
    }
  
    getAtoms(private newAtom: string) {
      return this.http.get('api/atoms.js')
      .map( (responseData) =&gt; {return responseData.json()})
      .map( data =&gt; {
          let results:Array&lt;Atom&gt; = [];
          for (var i = 0; i &lt; data.result.length; i++) {
              results.push(new Atom(data.result[i].id, data.result[i].name));
          }
          return results;
      });
    }
  }
  </code></pre>