How to convert an array object to a string in typescript constructor?
<p>Recently I started learning Angular 2 with basic knowledge on typescript. So, I tried to work out code using constructor. But I'm getting type error in the VS Code editor and also unable to get the expected output in the browser. I am sharing the code below and attaching the screenshot too. It would be very helpful if anyone tell me how to convert the Object in the Array to a string in the typescript constructor?</p>

<p>Here is the code:</p>

<pre><code>import { Component } from '@angular/core';

import { Hero } from './hero';

@Component({
  selector: 'app-root',
  templateUrl: './app.component.html',
  styleUrls: ['./app.component.css']
})
export class AppComponent {
  title: string;
  heroes: Array&lt;Hero&gt;;
  myHero: string;

  constructor() {
    this.title = "Tour Of Heroes";
    this.heroes = [
      new Hero(1, 'Windstorm'),
      new Hero(13, 'Bombasto'),
      new Hero(15, 'Magneta'),
      new Hero(20, 'Tornado')
    ];
    this.myHero = this.heroes[0];
  }
}
</code></pre>

<p>Screenshot:
<a href="http://i.stack.imgur.com/OHo3C.png" rel="nofollow">VS Code</a>
<a href="http://i.stack.imgur.com/uCKHL.png" rel="nofollow">Browser</a></p>

<hr>

<p>Author provided code copied from comment:</p>

<pre><code>&lt;h1&gt;{{title}}&lt;/h1&gt;
&lt;h2&gt;My favorite hero is: {{myHero}}&lt;/h2&gt;
&lt;p&gt;Heroes:&lt;/p&gt;
&lt;ul&gt;
  &lt;li *ngFor="let hero of heroes"&gt; {{ hero }} &lt;/li&gt;
&lt;/ul&gt;
</code></pre>