Question

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

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

正如您所看到的，有两个按钮可以对我的阵列进行更改。要删除我使用相同的控制器显示我的项目。这里一切都很好，按下按钮后索引视图列表更新。

问题在于编辑我的项目：

// 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存储array中的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));
    };

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

Answer 1

问题出在＆＃34;一次性绑定＆＃34; 我刚刚在::之前删除了<h2>{{::contact.firstName }} {{ ::contact.lastName }}</h2>，一切都搞定了！

从AngularJS中的另一个控制器更改后列表视图未更新

1 个答案: