title: Dynamic map of objects in Typescript and angular 4
body: <p>I'm trying to create a map structure to fill it dynamically with information from different sources:</p>
  
  <pre><code>export class VideoDataMap {
      [videoId: string]: {
          url: string,
          name: string
      };
  }
  </code></pre>
  
  <p>The problem is that when i assign data to the object attributes, it says the object is undefined. If I assign a string and not the object, it works.
  Anyone knows what i am missing here? </p>
  
  <pre><code>  public videoDataMap = new VideoDataMap();
  </code></pre>
  
  <p>This does not throw an error (but we are not using the object attributes)</p>
  
  <pre><code>  this.videoDataMap[videoId] = url;      
  </code></pre>
  
  <p>This throws an error  </p>
  
  <pre><code>   this.videoDataMap[videoId].url = url;  
  
     error: TypeError: Cannot set property 'url' of undefined
  </code></pre>
  
  <p>Thank you very much
  Best regards </p>