Vanilaの変換角度指令JavaScript関数

Question

私の問題はJavaScriptの関数に私の角度指令をどのように転送するかです。ベンはどんな成功を見せても今弱いことを探しています。

私は雇用主と秘密保持契約を結んでいるので、自分のコードを共有することはできませんが、その質問は容易に理解できると思います。

誰かから助言をいただけますか？

ここでは単純な例ですが、初心者であれば分かりやすいようにしてください。

これはディレクティブです：

function directiveWraper(scope, elem, attrs){ 
app.directive('helloWorld', function() { 
    return { 
    restrict: 'AE', 
    replace: true, 
    template: '<p style="background-color:{{color}}">Hello World', 
    link: function(scope, elem, attrs) { 
     elem.bind('click', function() { 
     elem.css('background-color', 'white'); 
     scope.$apply(function() { 
      scope.color = "white"; 
     }); 
     }); 
     elem.bind('mouseover', function() { 
     elem.css('cursor', 'pointer'); 
     }); 
    } 
    }; 
}); 
} 

だから私はjavascript関数でディレクティブをラップしたいと思い、プルすべて：私がやりたい何

app.directive('helloWorld', function() { 
    return { 
    restrict: 'AE', 
    replace: true, 
    template: '<p style="background-color:{{color}}">Hello World', 
    link: function(scope, elem, attrs) { 
     elem.bind('click', function() { 
     elem.css('background-color', 'white'); 
     scope.$apply(function() { 
      scope.color = "white"; 
     }); 
     }); 
     elem.bind('mouseover', function() { 
     elem.css('cursor', 'pointer'); 
     }); 
    } 
    }; 
}); 

はこのようなものですその関数内のパラメータ。

Answer 1

あなたが探しているように見えるのは、DOM要素をとり、id（DOM操作、スタイルなど）に変更を加える関数です。角度指示がすることは、DOMへの変更をコンテナにラップすることだけです。

angle.jsをコードに使用したくない場合は、達成したいものに対してjQueryが最も適していると思います。実際にこのディレクティブが使用しているのは、jQueryの軽量バージョンです。あなたのためのトリックを行う必要がありますどのような

がリンク機能のうちのすべてを取ると、このようなjQueryオブジェクトでelemはを置き換えるです：

var $elem = $(".myclass"); 
$elem.bind('click', function() { 
    $elem.css('background-color', 'white'); 
    //do something else onclick 
}); 

$elem.bind('mouseover', function() { 
    $elem.css('cursor', 'pointer'); 
}); 

あなたは、いくつかのより多くの変更を行う必要がありますが、この可能性がありますあなたを正しい軌道に導くはずです。また、ドキュメントのロード後にこのコードを呼び出して、探している要素がDOM上にあることを確認することもできます。

$.ready(function(){ 
    //..do stuff in here after the document.ready event fired 
});