2016-03-11 4 views
3

Я пытаюсь работать с директивами, чтобы применить несколько более лучших практик, но у меня есть некоторые вопросы о том, как наилучшим образом применить значение области действия из директивы.Является ли safeApply лучшей практикой?

В этом fiddle demo вы можете увидеть, если вы нажмете кнопку «Toggle displayMenu», div по-прежнему будет включен. При переключении линий 7-8 в коде директивы:

scope.yolo = function() { 
    scope.ctrl.toggle(); // COMMENT ME 
    //scope.ctrl.toggleApply(); // UNCOMMENT ME 
}; 

в:

scope.yolo = function() { 
    //scope.ctrl.toggle(); // COMMENT ME 
    scope.ctrl.toggleApply(); // UNCOMMENT ME 
}; 

ДИВ displayMenu будет переключать выключен.

Теперь проблема заключается в том, что я вынужден написать 2 функции: один с «$ scope. $ Apply» и один без него, и это явно не разумный способ сделать это ... , если я не использую safeApply like :

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

Является ли safeApply лучшей практикой? Если нет, то какой лучший способ выполнить то, что я хочу?

ответ

4

Глядя на $$phase считается плохой практикой. Из similar topic угловых разработчики сказали, что:

По причинам будущего проверки правописания, вы не должны использовать $$ фазы

рекомендуемых Лучше всего использовать либо $timeout или $evalAsync которые оба отложить выполнение кода. По сути, обе функции будут выполняться в новом цикле $ digest, так что вам не нужно вручную вызывать $ apply. В большинстве случаев вы, вероятно, можете использовать $ evalAsync, если вам просто нужно обновить код в сценарии safeApply.

scope.$evalAsync(function(scope) { 
    // run the toggle function without caring if you're in the digest or not 
    scope.ctrl.toggle(); 
}); 

Вы можете прочитать this article by Ben Nadal, чтобы увидеть, как различные функции получить выполняется в процессе JavaScript.