title: AngularJS: how to bind a constant object to a directive
body: <p>I've created a directive with a binding using "scope". In some cases, I want to bind a constant object. For instance, with HTML:</p>
  
  <pre><code>&lt;div ng-controller="Ctrl"&gt;
      &lt;greeting person="{firstName: 'Bob', lastName: 'Jones'}"&gt;&lt;/greeting&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p>and JavaScript:</p>
  
  <pre><code>var app = angular.module('myApp', []);
  
  app.controller("Ctrl", function($scope) {
  
  });
  
  app.directive("greeting", function () {
      return {
          restrict: "E",
          replace: true,
          scope: {
              person: "="
          },
          template:
          '&lt;p&gt;Hello {{person.firstName}} {{person.lastName}}&lt;/p&gt;'
      };
  });
  </code></pre>
  
  <p>Although this works, it also causes a JavaScript error:</p>
  
  <pre><code>Error: 10 $digest() iterations reached. Aborting!
  </code></pre>
  
  <p><a href="http://jsfiddle.net/7bNAd/82/">(Fiddle demonstrating the problem)</a></p>
  
  <p>What's the correct way to bind a constant object without causing the error?</p>