Question: Receiving the error when the page is loaded. I'm trying to append a new object to an array of entries.

[![enter image description here](https://i.stack.imgur.com/vEPoz.png)](https://i.stack.imgur.com/vEPoz.png)

[![enter image description here](https://i.stack.imgur.com/UrsDj.png)](https://i.stack.imgur.com/UrsDj.png)

What is wrong with the code?

**index.html**
Raffler
=======

```
<div ng-controller="RaffleCtrl">

  <form ng-sumbit="addEntry">
    <input type="text" ng-model="newEntry.name">
    <input type="submit" value="Add">
  </form>

  <ul>
    <li ng-repeat="entry in entries">{{entry.name}}</li>
  </ul>
</div>

```

**raffle.js**

```
angular.module('myApp', []).controller("RaffleCtrl", function ($scope) {
  $scope.entries = [
      {
        name: "Larry"
      }, {
        name: "Curly"
      }, {
        name: "Moe"
      }
    ]
});

$scope.addEntry = function () {
  $scope.entries($scope.newEntry)
  $scope.newEntry = {}
};

```

Answer: 
You wrongly used `$scope` outside the controller. Use the `$scope` inside the controller 

```
angular.module('myApp', []).controller("RaffleCtrl", function ($scope) {
  $scope.entries = [
      {
        name: "Larry"
      }, {
        name: "Curly"
      }, {
        name: "Moe"
      }
    ];

   $scope.addEntry = function () {
     $scope.entries($scope.newEntry)
     $scope.newEntry = {}
   };
});

```
if you really want to keep it outside

```
angular.module('myApp', []).controller("RaffleCtrl", function ($scope) {
  $scope.entries = [
      {
        name: "Larry"
      }, {
        name: "Curly"
      }, {
        name: "Moe"
      }
    ];
  $scope.addEntry = addEntry;
});

function addEntry() {
  $scope.entries($scope.newEntry)
  $scope.newEntry = {}
};

```