title: @Input() is not working when selector is enclosed in HTML Tag - Angular 2
body: <p>In my <code>Angular2</code> app there is a component called <code>TabTitleComponent</code>.</p>
  
  <pre><code>       import { Component, OnInit,Input,AfterViewInit } from '@angular/core';
  
        @Component({
          selector: 'tab-title',
          templateUrl: './tab-title.component.html',
          styleUrls: ['./tab-title.component.css']
        })
        export class TabTitleComponent implements OnInit,AfterViewInit {
  
          @Input() title;
  
          ngOnInit()
          {
            console.log('ngOnInit'+this.title);
          }
          ngAfterViewInit()
          {
            console.log('ngAfterViewInit',this.title);
          }
  
        }
  </code></pre>
  
  <p>I am using this component in my <code>AppComponent</code>.</p>
  
  <blockquote>
    <p>Problem 1</p>
  </blockquote>
  
  <p>When I use <code>TabTitleComponent</code> in HTML(<code>AppComponent</code>'s Template) as following then I am not getting <code>title</code> value. In console it is logging <code>undefined</code>.</p>
  
  <pre><code> &lt;div&gt;
     &lt;tab-title [title]='88'&gt; &lt;/tab-title&gt;     
  &lt;/div&gt;
  </code></pre>
  
  <p>when I replace it with following then I am getting <code>88</code> in console.</p>
  
  <pre><code> &lt;tab-title [title]='88'&gt; &lt;/tab-title&gt;  
  </code></pre>
  
  <blockquote>
    <p>Problem 2</p>
  </blockquote>
  
  <p>When I make <code>title</code> of <code>string</code> type and pass value then in both cases I am getting <code>undefined</code>. </p>
  
  <p>I am not able to find the root cause. Can someone helps me to find out the issue.</p>