Angular：無法訪問我的角度指令中的element.bind中的變量，所以我可以用它操作DOM

我想寫一個指令，返回一個布爾值，當用戶滾動特定的容器，當它們不滾動時爲false。我有這個工作，我可以看到正確的布爾切換，當我在我使用的element.bind（'scroll'）內部拋出一個console.log時，但它不影響我設置的外部相同名稱的作用域變量element.bind。你可以看到這種情況出現，如果你看看這個的jsfiddle我扔在一起：https://jsfiddle.net/hurgledurf/bwyyL7mj/Angular：無法訪問我的角度指令中的element.bind中的變量，所以我可以用它操作DOM

這是我對指令代碼：

(function() { 
    'use strict'; 
    angular 
     .module('myWebPage') 
     .directive('scrollingDirective', scrollingDirective); 

    function scrollingDirective() { 
     var directive = { 
      restrict: 'AE', 
      link: link 
     }; 
     return directive; 

     function link (scope, element, attributes) { 
      scope.actuallyScrolling = true; 
      var timer; 
      element.bind('scroll', function() { 
       scope.actuallyScrolling = true; 
       console.log('USER IS SCROLLING ', scope.actuallyScrolling); 
       clearTimeout(timer); 
       setTimeout(function() { 
        scope.actuallyScrolling = false; 
        console.log('INSIDE TIMER ', scope.actuallyScrolling); 
       }, 1000); 
      }) 
     } 

    } 
})();

這是一些基本的HTML我扔在一起作爲例如：

<body ng-app="myWebPage"> 
    <div class="container" scrolling-directive> 
    <p> 
    scroll and check the console.log! 
    Scrolling Boolean: {{actuallyScrolling}} 
    </p> 
    <div class="filler"></div> 
    </div> 
</body>

如果你看看JS的小提琴，你可以看到scope.actuallyScrolling變量切換中的console.log開啓和關閉，但不會在DOM改變。這讓我擔心有些問題正在出現，我還沒有弄清楚，而Angular將它們當作兩個獨立的變量。任何人都有這方面的見解？謝謝。

來源

2017-08-23 amacdonald

您可以使用scope.$apply()初始化手動scope更新：fiddle

來源

2017-08-23 04:42:50

是的，我確實試過了。它適用於JSFiddle，但在我正在處理的實際頁面上，我收到了「正在申請中」錯誤。 – amacdonald

確定你在異步函數 –

的回調中使用'scope。$ apply'啊，是的，我把範圍$ apply（）放在了錯誤的地方。謝謝！ – amacdonald

Angular：無法訪問我的角度指令中的element.bind中的變量，所以我可以用它操作DOM

回答

相關問題