title: AngularJS Interpolation Error
body: <p>I am displaying the properties of a room as part of a room management application I am working on, this is the output:</p>
  
  <p><img src="https://i.stack.imgur.com/XTVCf.png" alt="enter image description here"></p>
  
  <p>As you can see, the value of Beamer (Projector in english) is "Sony (lamp 01/12/2013)". This output is correct but when I open my console I see some errors concerning interpolation:</p>
  
  <p><img src="https://i.stack.imgur.com/6LAli.png" alt="enter image description here"></p>
  
  <p>Larger resolution:</p>
  
  <p><a href="https://i.stack.imgur.com/6LAli.png" rel="noreferrer"><img src="https://i.stack.imgur.com/6LAli.png" alt="enter image description here"></a></p>
  
  <pre><code>"Can't interpolate: {{getBeamerString()}} TypeError: Cannot read property 'aanwezig' of undefined"
  </code></pre>
  
  <p>This is my html partial:</p>
  
  <pre><code>&lt;section class="eigenschappen"&gt;
      &lt;table class="table table-striped table-hover table-bordered"&gt;
          &lt;thead&gt;
          &lt;tr&gt;
              &lt;th&gt;Eigenschap&lt;/th&gt;
              &lt;th&gt;Waarde&lt;/th&gt;
              &lt;th&gt;Bewerk&lt;/th&gt;
          &lt;/tr&gt;
          &lt;/thead&gt;
          &lt;tbody&gt;
  
          ...
  
          &lt;tr&gt;
              &lt;td&gt;&lt;img class="ruimteNaam" src="../Images/Beamer.png" alt=""/&gt;Beamer&lt;/td&gt;
              &lt;td&gt;{{getBeamerString()}}&lt;/td&gt;
              &lt;td&gt;&lt;img class="edit" src="../Images/Edit.png" alt=""/&gt;&lt;/td&gt;
          &lt;/tr&gt;
  
          ...
  
          &lt;/tbody&gt;
      &lt;/table&gt;
  &lt;/section&gt;
  </code></pre>
  
  <p>currentRuimte (CurrentRoom in English) is a scope defined variable that gets its value using a resource service that gets that data from my mongoDB:</p>
  
  <pre><code>function RuimteController($scope, $routeParams, Ruimte) {
  
      $scope.currentRuimte = Ruimte.get({
          ruimteNaam: $routeParams.ruimteNaam
      });
  
      $scope.getBeamerString = function () {
          var beamer = $scope.currentRuimte.beamer;
          if(beamer.aanwezig == 'Ja'){
              return beamer.typeBeamer + ' (lamp: ' + beamer.datumLamp + ')';
          }else{
              return '-';
          }
      }
  }
  </code></pre>
  
  <p>When I inspect the scope using batarang I get this:</p>
  
  <p><img src="https://i.stack.imgur.com/mXSaO.png" alt="enter image description here"></p>
  
  <p>Why do I get the error and why do I still get the correct output?
  Is there a way to prevent the error from happening? Please correct me as much as you can,
  I am fairly new to AngularJS and Javascript in general and trying to expand my skillset.</p>