javascript - AngularJS 中另一个 Controller 发生更改后 ListView 未更新

Question

我不知道为什么，但我的index.html不想更新。我将尝试用代码来展示我的问题:

//Index.html 部分:

<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>

正如您所看到的，有两个按钮可以对我的数组进行更改。为了删除，我使用与显示我的项目相同的 Controller 。这里一切都很好，按下按钮后索引 View 列表会更新。

问题在于编辑我的项目:

//IndexController 部分:

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 将联系人数组存储在localStorage中:

//从服务更新方法

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);
}

//以及来自 EditCtrl 的函数:

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

我做了同样的事情，但所有联系人的主视图仅在页面刷新后更新。此外，如果我在编辑后打开模型窗口，联系人的值也会更新。我的代码有什么问题吗？提前致谢!

Answer 1

问题出在“一次性绑定(bind)”中，我刚刚删除了 ::之前<h2>{{::contact.firstName }} {{ ::contact.lastName }}</h2>一切顺利!