List view not updating after changes from another controller in AngularJS

Question

I don't know why, but my index.html doesn't want to be updated. I will try to show my problem with code:

// Index.html part:

<ion-view>
    <ion-content has-header="true" has-subheader="true">
       <ion-list can-swipe="true">
        <ion-item class="item item-avatar item-remove-animate" ng-repeat="contact in contactIndexCtrl.contacts | filter: contactIndexCtrl.search track by contact.id"
            ui-sref="root.contact-detail(::{ id: contact.id })">
                <img ng-src="./img/{{::contact.pic}}"> 
                    <h2>{{::contact.firstName }} {{ ::contact.lastName }}</h2>
            <ion-card-content>
                <h2>{{::contact.title}}</h2>
                <p ng-bind-html="::contact.department"></p>
            </ion-card-content>
            <ion-option-button ng-click="contactIndexCtrl.edit(contact)" class="button-light icon ion-edit"> Edit</ion-option-button>
            <ion-option-button ng-click="contactIndexCtrl.remove($event, contact)" class="button-assertive icon ion-trash-a" > Delete</ion-option-button>
        </ion-item>
        </ion-list>
    </ion-content>
</ion-view>

As you can see there are two buttons which can make changes with my array. For deleting I'm using the same controller with displaying my items. Here everything is fine and the list of index view updating after button pressed.

The problem is in editing my items:

// IndexController part:

import contactEditTemplate from "../contact-edit/contact-edit.html";
export default class ContactIndexController {

    constructor($scope, $state, $q, $log, $ionicModal, $ionicListDelegate, contactsService) {
        'ngInject';
        let vm = this;
        vm.edit = edit;
        vm.remove = remove;

        contactsService.findAll().then((contacts) => {
            vm.contacts = contacts;
        });

        $scope.modal = $ionicModal.fromTemplate(contactEditTemplate, {
            scope: $scope,
            animation: 'slide-in-up'
        });

        $scope.$on('modal.hidden', function () {
            contactsService.findAll().then(angular.bind(this, function (response) {
            vm.contacts = response;
        });
        function edit(item) {
            $scope.editingItem = item;
            $ionicListDelegate.closeOptionButtons();
            $scope.modal.show();
        }

        function remove(event, item) {
            contactsService.remove(item);
        }

contact-edit.html :

<ion-modal-view>
  <ion-header-bar class="bar bar-header bar-positive">
    <h1 class="title">New Contact</h1>
    <button class="button button-clear button-primary" ng-click="modal.hide()">Cancel</button>
  </ion-header-bar>
  <ion-content ng-controller="ContactEditController as contactEditCtrl" class="padding">
    <div class="list">
      <label class="item item-input">
              <span class="input-label">First Name</span>
              <input ng-model="editingItem.firstName" type="text">
            </label>
      <label class="item item-input">
              <span class="input-label">Last Name</span>
              <input ng-model="editingItem.lastName" type="text">
            </label>
      <label class="item item-input">
              <span class="input-label">Email</span>
              <input ng-model="editingItem.email" type="text">
            </label>
      <div class="list">
        <label class="item item-input item-select">
    <div class="input-label">
      Select Manager
    </div>
    <select name="managerSelection" ng-model="editingItem.managerId">
    <option ng-repeat="manager in contactEditCtrl.contacts" value="{{manager.id}}">{{manager.firstName + " " + manager.lastName}}</option>
    </select>
    </label>
      </div>
      <button class="button button-full button-positive" ng-click="save(editingItem)">Save Edits</button>
    </div>
  </ion-content>
</ion-modal-view>

contactsService store array of contacts in the localStorage:

// Update method from service

update(item) {
    this.$storage.contacts.some(function (contact) {
        if (parseInt(contact.id) === parseInt(item.id)) {
            Object.assign(contact, item);
            return true;
        }
    });
    return this.$q.when(this.$storage.contacts);
}

// And functions from EditCtrl:

    $scope.save = function (item) {
        $log.info($scope.editingItem);
        $scope.modal.hide();
        contactsService.update($scope.editingItem).then((contacts) => {
            vm.contacts = contacts;
        }.bind(this));
    };

I do the same things but the main view with all contacts updating only after page refresh. Also if I open my model window after editing the contact has updated values. Whats the problem with my code? Thanks in advance!

Answer 1

The problem is in "One-time binding" I just deleted :: before <h2>{{::contact.firstName }} {{ ::contact.lastName }}</h2> and everything get worked!