title: Angular Data Binding after loading html from HTML 5 localStorage
body: <p>I start with an empty container in my html with id <em>#template</em>. When the user clicks a blue button in the right bottom corner of the browser an image tag is added to the container. The image tag which source and alt text are bound with angular to the values of two input elements as show in the code below. </p>
  
  <p>After the user enters a url for the image source and text for the alt text, he/she can click a button to save the entire html code of the image with the new values entered for imgSrcB1 and altTxtB1 in the Html 5 localStorage</p>
  
  <pre><code>//input and image bound in angular with imgSrcB1 and altTxtB1
  &lt;input type="text" name="imagelink" ng-model="imgSrcB1"&gt;
  &lt;input type="text" name="title" ng-model="altTxtB1"&gt;
  
  &lt;img style="width:100%;" ng-src="{{imgSrcB1}}" alt="{{altTxtB1}}" /&gt;    
  </code></pre>
  
  <p>.</p>
  
  <p>Here is how I am storing the contents of a container width id <em>#template</em> in a local storage. This container contains the img element as a child node.</p>
  
  <pre><code>//localStorage stores value of source and alt attribute of image after user edit.
  var temp = jQuery('#template').html();
  if (typeof(Storage) !== "undefined") {
      localStorage.setItem("cookie", temp);
  } else {
      document.getElementById("cookie-wrapper").innerHTML = "Sorry, your browser 
      does not support Web Storage...";
  }
  </code></pre>
  
  <p>.</p>
  
  <p>When the user refreshes the page, and clicks on the same blue button, the image now loads with the image source and alt text entered previously. <strong>But here is where the user loses angular data binding. Editing the values of the input fields no longer updates the image source and alt text.</strong></p>
  
  <p>I would like the user to be able to change again the source and alt text after loading the image with data filled from localStorage.</p>
  
  <pre><code>function loadCookie() {
      document.getElementById("cookie-wrapper").innerHTML = 
      localStorage.getItem("cookie");
  }
  </code></pre>
  
  <p>.</p>
  
  <p>I hope you understood me. Thank you for your contribution</p>