Angular TypeError: Cannot create property on string ''


Trying to clear the input box after Add is clicked, like the guy is doing in this tutorial.
I have recreated the error without using the API, with this short code.
You can also check out the Plunker.


<input ng-model="" type="text">
<button ng-click="Add()">Add</button>

<ul ng-repeat="contact in contactList">
    <li>{{ }}</li>


$scope.contactList = [
    {name: 'cris'}, {name: 'vlad'}

$scope.Add = function() {
    $ = ""

It seems that i can add 1 item, but on the second i get this Error: enter image description here

Problem courtesy of: Cristian Muscalu


You didn't clean your contact object the right way. In the Add() function, change:

$ = ""


$ = {};

Forked Plunker

Solution courtesy of: Mistalis


You are setting the $ property to a string here:

$ = ""

In your template you are binding to here:

<input ng-model="" type="text" class="form-control">

a string does not have the property "name", hence the error. A fix would be to do this:

$ = { name: "" }

This creates a new object with the property "name" and an empty string as the value of that property.

Discussion courtesy of: dmungin

This recipe can be found in it's original form on Stack Over Flow.