Displaying JSON data with ng-bind shows [object object]
<p>I'm new to angular js,I have 2 goals:</p>

<ol>
<li>OnClick, display a single person's name from a JSON array,</li>
<li>Randomize name on every click</li>
</ol>

<p>I'm stuck at the part where i need to pass the json data to the view: when i click the button i get [object object], [object object], [object object] 
Could someone please assist? </p>

<pre><code>[
    {"name": "John"},
    {"name": "Sue"},
    {"name": "Sally"},
    {"name": "Jim"},
    {"name": "Bev"},
    {"name": "Joe"},
    {"name": "Jess"}
]
</code></pre>

<p>script</p>

<pre><code>  var peopleApp = angular.module('peopleApp', []);
    idApp.controller('peopleCtrl', ['$scope', '$http', function ($scope, $http){
      $scope.randomPerson = function(){
      $http.get('js/people.json').
       success(function(data) {
       $scope.person = data;
       console.log(data);
  });
 }
}]);
</code></pre>

<p>view</p>

<pre><code>&lt;div class="content"&gt;
 &lt;div ng-controller="peopleCtrl"&gt;
  &lt;p ng-bind="name"&gt;&lt;/p&gt;
   &lt;button ng-click="randomPerson()"&gt;
    Show random person's name
   &lt;/button&gt;
   &lt;p ng-bind="person"&gt;&lt;/p&gt;
 &lt;/div&gt;
&lt;/div&gt;
</code></pre>