title: angularjs Set image while waiting for controller
body: <p>I have an angularjs-Application.</p>
  
  <p>In one Controller i´m waiting for an image source address - I get this from an PHP-Service.</p>
  
  <pre><code>controller.controller("LayoutCtrl", 
  ["$scope", "$http", "$route", 
  function($scope, $http, $route) {
      $scope.$route = $route;
      $http.get('zkLib/services/header.php').success(function(data) { 
          $scope.header = data; });
  }]);
  </code></pre>
  
  <p>The header.php looks like this:</p>
  
  <pre><code>$result = array();
  
  $result['index'] = db()-&gt;loadSetting('index_page');
  $result['banner'] = db()-&gt;loadSetting('site_banner');
  
  echo json_encode($result);
  </code></pre>
  
  <p>So in my template i´ve written:</p>
  
  <pre><code>        &lt;div ng-controller="LayoutCtrl"&gt;
              &lt;div desc="header"&gt;
                  &lt;a desc='hp_link' href="#{{header.index}}"&gt;
                      &lt;img desc='banner' ng-src="zkLib/f/img/{{header.banner}}"&gt;
                  &lt;/a&gt;
              &lt;/div&gt;
          &lt;/div&gt;
  </code></pre>
  
  <p>My Problem is now:</p>
  
  <p>When the site opens, it shows the "NoImage"-Icon from the Browser while waiting for this service.
  After this the image will be viewed correctly.</p>
  
  <p>But in my COnsole i have this error too:</p>
  
  <pre><code>Resource interpreted as Image but transferred with MIME type text/html: "http://localhost:160/cms/app/zkLib/f/img/". 
  </code></pre>
  
  <p>On my Server i have the image 'loading.gif', i want to show this while i´m waiting for my service.</p>
  
  <p>How to solve this? Could someone help?</p>