Forms and binding - appears to be one way only?

I’ve a list of items. They are objects held in itemArray. When you touch one you it fires ng-click=“openEditor(item)”. Like this:

  <ion-item ng-repeat="item in ItemArray" class="item item-avatar" ng-click="openEditor(item)">
    <img ng-src="{{iconMap[item.type]}}">
    <p>ASA {{item.priority}}: {{item.itemType}}</p>

Then this happens:

$scope.openEditor =function(item){ 
   $scope.currentItem = item;

and in the modal I have

<select ng-model="currentItem.priority">
          <option value="1">1</option>
          <option value="2">2</option>
          <option value="3">3</option>
          <option value="4">4</option>
          <option value="5">5</option>

It shows the correct priority in the dropdown (I’ve tested it with a lot of the items).

The problem is - I cannot change it! If I try I can’t alter the option in the dropdown.

Why is this happening? I want to change the priority and then save it back into the itemArray and SQL DB.

I put a question on Stack Overflow.

Someone created a Plunker of this. It works fine on the Plunker so the only thing I can think is its to do with modal somehow.

Any ideas?

I realise I’ve got an error in the console:

TypeError: Cannot assign to read only property 'priority' of #<Object>

I’ve searched for this an it appears it’s an angularjs error that has been fixed. What version of angular does the current ionic use?

Hey there, so the current version of angular used in ionic is 1.3.6.

Do you mind putting together a codepen?

I’m investigating other solutions at the moment.

I’m loath to create a codepen because it’s a massive amount of work. Our app doesn’t use for the templates so I’ll probably mess up the codepen!

I’ve found, oddly, that on the phone I CAN change things in the form.

I’m using Chrome Inspect - on my Mac and PC I get the same console error. But on my Nexus 4, using Chrome Inspect there is no error.

This is most odd. It makes it very hard to test though.

Got the answer.

When I use


it creates a non-editable copy of the object.

The way to do it is:

$scope.modal = modal;
$scope.currentItem = angular.copy(item);

Simple solution. Headache to find.