通常のカスタムjsイベントを角度コントローラ関数にバインドする

Question

hereのように、角度指令を使って角度関数を通常のjsイベント（logedInイベント）にバインドしようとしています。

ディレクティブのコードは次のとおりです。

evApp.directive('onlogin', function() { 
return { 
    restrict: 'A', 
    transclude: true, 
    scope: { 
     'onlogin': '&' 
    }, 
    link:function (scope, element, attr) { 
     //Code to detect when element is pulled goes here 
     document.addEventListener("logedIn", function (e) { 
      scope.$eval(attr.onlogin); 
     }); 
    } 
} 
}); 

htmlタグは次のとおりです。

<div onlogin="loggedIn()"></div> 

そのが働いていたが、私はイベントに到着したパラメーター「e」を渡す方法が見つかりませんでしたリンク機能では私はhtmlから関数ハンドラだけを渡そうとし、リンク関数からのパラメータで関数を呼び出そうとしましたが、うまくいきませんでした。 いくつかのことのように：

<div onlogin="loggedIn"></div> 

おかげで、Amichaiは

Answer 1

onlogin関数の呼び出しは、パラメータを追加するために、匿名関数内である必要がありますが、機能はそれ以外の場合は発生しません、無名関数の外に保存する必要があります。

evApp.directive('onlogin', function() { 
    return { 
     restrict: 'A', 
     transclude: true, 
     scope: { 
     'onlogin': '&' 
     }, 
     link:function (scope, element, attr) { 
      //Code to detect when element is pulled goes here 
      document.addEventListener("logedIn", function (e) { 
      var fn = scope.onlogin(); 
      scope.$apply(function() { 
        fn(e); 
      }); 
      }); 
     } 
    } 
}); 

Answer 2

スコープを追加する必要があります$それがサイクルを消化発射する必要があることになりました角度で​​きるように適用し、ちょうどscope.onloginを呼び出す（{E：E}。 ）基本的には$ eventを使うようにハンドラで使うことができます。

evApp.directive('onlogin', function() { 
return { 
    restrict: 'A', 
    transclude: true, 
    scope: { 
     'onlogin': '&' 
    }, 
    link:function (scope, element, attr) { 
     //Code to detect when element is pulled goes here 
     document.addEventListener("logedIn", function (e) { 
      scope.$apply(function() { 
      scope.onlogin({e: e}) 
      }); 
     }); 
    } 
} 
});