Question

首先，如果帖子太长，我很抱歉。另外，为了防止你以某种方式干扰你可能给我的答案，我不会以通常的方式定义我的控制器。相反，我关注http://www.technofattie.com/2014/03/21/five-guidelines-for-avoiding-scope-soup-in-angular.html，然后执行：

var game_1 = function($scope){
  var _this = this;
  //some code
  $scope.someFunction = function() {
    _this.someFunction() ;
  } ;
} ;
game1.prototype.someFunction = function() {
  //some code
} ;
game_1.$inject = ['$scope'] ;
app.controller('game_1', game_1) ;

在我的HTML中，我有一个属性为ng-show="checkRare"的对象。现在，我有一套有点像俄罗斯套娃的功能：

在控制器内定义：

this.promptElement = function(message) {
    var input = prompt(message) ;
    if ( input === null ) {
        this.resetCell(this.cellIJ) ;
        return false ;
    } else if ( input === '' ) {
        this.resetCell(this.cellIJ) ;
        return '' ;
    } else {
        return input.toUpperCase() ;
    }
} ;
//some more code
$scope.function1 = function(i,j,F) {
    _this.function1(i,j,F) ;
} ;
$scope.function2A = function(j) {
    _this.function2A(j) ;
} ;
$scope.function2B = function(i,F) {
    _this.function2B(i,F) ;
} ;
$scope.function3A = function() {
    _this.function3A() ;
} ;
$scope.function3B = function() {
    _this.function3B() ;
} ;
$scope.function4 = function() {
    $scope.checkRare = true ; //THE PROBLEM LIES HERE
    _this.function4() ;
} ;

在外面，我有：

game_1.prototype.function1 = function(i,j,F) {
    //some code 
    this.inputElement = this.promptElement('Enter element name') ;
    //some more code
} ;
game_1.prototype.function2A = function(j) {
    //some code
    for ( var i = 1 ; i < 8 ; i++ ) {
        this.function1(i,j) ;
        if ( this.inputElement === false ) { return ; }
    }
} ;
game_1.prototype.function2B = function(i,F) {
    //some code
    for ( var j = j0 ; j < jF ; j++ ) {
        this.function1(i,j,F) ;
        if ( this.inputElement === false ) { return ; }
    }
} ;
game_1.prototype.function3A = function() {
    //some code
    for ( var j = 1 ; j < 19 ; j ++ ) {
        this.function2A(j) ;
        if ( this.inputElement === false ) { return ; }
    }
} ;
game_1.prototype.function3B = function() {
    //some code
    for ( var i = 6 ; i < 8 ; i++ ) {
        this.function2B(i,true) ;
        if ( this.inputElement === false ) { return ; }
    }
} ;
game_1.prototype.function4 = function() {
    //some code
    this.function3A() ;
    if ( this.inputElement === false ) { return ; }
    this.function3B() ;
} ;

然而，正如有人在我提出的另一个问题中建议的那样，$scope在整个功能完成之前不会刷新，所以我将无法看到$scope.checkRare = true的影响。结束。为了使它成为第一件事，我尝试使用$scope.$apply，但我得到了错误$apply already in progress（顺便说一句，我也有时随机得到）。我也尝试过使用$timeout和“safeApply”方法（https://coderwall.com/p/ngisma/safe-apply-in-angular-js），但两人都没有用过。

那么，关于如何在函数的其余部分之前看到$scope.checkRare = true的结果的任何想法都会运行？而且，作为第二个问题，有人可以告诉我为什么即使我没有明确地使用$apply already in progress，我有时会得到$scope.$apply吗？

提前致谢！再次，抱歉长篇大论！：）

Answer 1

我可能不完全理解你的问题，但我认为你正在寻找的是这样的：

...
$scope.doSomething = function(){
  $scope.checkRare = true;
  $timeout(function(){
    // check for results of setting $scope.checkRare
  });
}
...

要了解其工作原理，了解JavaScript Event Loop会有所帮助。简而言之，DOM在事件循环迭代结束之前不会更新。循环的每次迭代都不会结束，直到JavaScript引擎用完代码才能执行。当您将代码放入超时回调（没有延迟）时，您实际上是在告诉JavaScript引擎在循环的下一次迭代中运行该回调（从而允许在回调运行之前更新DOM）。

从$ scope.function（）中刷新$ scope

1 个答案: