0
私はユーザーがスクロールしているときに真であるブール値を返すディレクティブを書こうとしています。スクロールしていないときはfalseになります。私は、私が使用しているelement.bind（ 'scroll'）の中にconsole.logをスローすると、ブーリアントグルが正しく切り替わることを見ることができるという点でこの作業を行っていますが、私が設定した同じ名前のスコープ変数には影響しません。 element.bind。 https://jsfiddle.net/hurgledurf/bwyyL7mj/角：私の角度の指示に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であるあなたは、このJSFiddleを見てみるならば、私は一緒に投げたこの出来事を見ることができます例は：
<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は2つの別々の変数として扱っています。誰もがこれについての洞察を持っていますか？ありがとうございました。
うん、私は実際にそれを試してみました。それはJSFiddleで動作しますが、実際のページでは私は "既に適用中"というエラーが出ます。 – amacdonald
async関数のコールバックの中で 'scope。$ apply'を使うことを確かめてください。 –
ああ、ええ、間違った場所に$ apply（）を置いていました。ありがとうございました！ – amacdonald