Question

我有一个非常严重的问题，我正在更新，编辑，删除数据，而且双向数据绑定无效。

这是我的控制员之一：

'use strict';
var EventController = function($timeout, $scope, $state, EventModel) {
    this.$timeout   = $timeout;
    this.$scope         = $scope;
    this.$state         = $state;
    this.EventModel = EventModel;

    /**
     * When the page is requested, retrieve all the data.
     *
     */
    this.retrieve();
};

EventController.prototype = {
    create: function(event) {
        var that = this;
        this.EventModel.Model.insert(event)
            .then(function() {
                that.refresh();
            });
    },

    retrieve: function() {
        var that = this;
        this.EventModel.Model.find()
            .then(function(result) {
                that.$scope.events = result;
            });
    },

    one: function(id) {
        var that = this;
        this.EventModel.Model.one(id)
            .then(function(result) {
                that.$scope.event = result;
            });
    },

    update: function(id, event, state) {
        if (state !== undefined) {
            event.is_active = state;
        }

        var that = this;
        this.EventModel.Model.update(id, event)
            .then(function() {
                that.refresh();
            });
    },

    delete: function(id) {
        var check = $('[data-controller-input]:checked');
        var that    = this;

        $.each(check, function() {
            var target  = $(this);
            var id          = target.prop('id');

            that.EventModel.Model.remove(id)
                .then(function() {
                    that.refresh();
                });
        });
    },

    clear: function() {
        this.$scope.event = angular.copy(this.$scope.initial);
    },

    refresh: function() {
        this.$state.go(this.$state.current, {}, {reload: true});
    }
};

angular
    .module('adminApp')
    .controller('EventController',
        [
            '$timeout',
            '$scope',
            '$state',
            'EventModel',
            EventController
        ]
);

在创建，更新和删除方法中，我需要在不刷新页面的情况下更新HTML，我已经尝试在结果出现后使用$ scope.apply，$ scope.digest，$ timeout，但不会在HTML中发生

如果我尝试$ scope.apply和$ scope.digest，则错误将是：

Prevent error $digest already in progress when calling $scope.$apply()

所以我试图用$ timeout包装$ scope。$ apply或$ digest，结果相同，没有任何反应。

感谢。

Answer 1

首先，您的刷新方法永远不会更新您的控制器。因为this.$state.current无法解析任何网址，模板或控制器，因此只会失败。

这是您无法查看更新数据的主要原因，只需检查您的控制台，您可能会收到Error: Cannot transition to abstract state '[object Object]'错误。

更新：我创建了一个plnkr.as我无法访问事件模型代码，我只是将其删除并尝试创建相同的场景。

http://plnkr.co/edit/RsI3TgKwcjGEXcTMKoQR?p=preview

看看这是否可以帮助你

Answer 2

我不确定，但尝试使用以下函数在执行函数之前检查当前阶段。它可以解决这个问题。

$scope.safeApply = function(fn) {
  var phase = this.$root.$$phase;
  if(phase == '$apply' || phase == '$digest') {
    if(fn && (typeof(fn) === 'function')) {
      fn();
    }
  } else {
    this.$apply(fn);
  }
};

用法：

$scope.safeApply(function() {
  //Your lines
});

当$ scope更新时，Angular双向数据绑定不起作用

2 个答案: