0

サードパーティのライブラリをカプセル化するディレクティブを作成しようとしています。私のディレクティブは次のようになります。

angular.module('MyApp').directive("shareButton", [function() {
    return {
        link: function($scope, elem, attrs ) {
            stWidget.addEntry({
                "service": attrs.service,
                "element": elem[0],
                "url": attrs.shareUrl,
                "title": attrs.shareTitle,
                "type": attrs.type || "chicklet",
                "text": attrs.displayText || "",
                "image": attrs.shareImage
            });

        }
    };
}

そして、使用法は次のようになります。

<a href="#" share-button 
            type="chicklet" 
            service="facebook" 
            share-url="{{shareUrl}}" 
            share-title="{{shareTitle}}" 
            share-image="{{shareImage}}"></a>

問題が発生するのは、{{ someValue }}バインディングを使用する場合です。ディレクティブでのlinkメソッドの呼び出し中に、これらの値はnullとして渡されます。これらの値を取得するには、を使用する必要がありますattrs.$observe()。問題は、私が使用しているサードパーティのライブラリには、を呼び出した後にこれらの値を変更する方法がまったくないことですstWidth.addEntry()。私は彼らのコードをたくさん分析しました、そして彼らは私がそれらの値を変更できないことを確認するためにクロージャとローカル変数を使用します。

したがって、サードパーティのライブラリについては、書き直す以外に何もできません。そのため、stWidget.addEntry()すべての値が得られるまでそのメソッドの呼び出しを遅らせるために、Angularで何ができるかという質問があります。attrs.$observe()または、メソッドを使用する必要のないバインディングの形式はありますか？

変更をバインドする必要はありません。この場合、単純な1回限りのバインディングで十分です。

4

3 に答える 3

1

使用$timeoutすると問題が解決するはずです

angular.module('MyApp').directive("shareButton", [function($timeout) {
    return {
        link: function($scope, elem, attrs ) {
           $timeout(function(){
            stWidget.addEntry({....
           },0);
});
于 2013-03-26T02:47:49.980 に答える
1

スコープの$evalメソッドを使用し$scopeて、リンク関数の内部に対して属性を評価できます。

HTML：

<a href="#" share-button type="chicklet" service="facebook" share-url="shareUrl"
 share-title="shareTitle" share-image="shareImage">

ディレクティブリンク機能：

link: function ($scope, elem, attrs) {
   console.log($scope.$eval(attrs.shareUrl), 
               $scope.$eval(attrs.shareTitle),
               $scope.$eval(attrs.shareImage))
   stWidget.addEntry({
      "service":  attrs.service,
       "element": elem[0],
       "url":     $scope.$eval(attrs.shareUrl),
       ...
于 2013-03-26T02:59:34.703 に答える
1

リンク関数でattrs。$observeを使用する必要があると思います。

http://docs.angularjs.org/guide/directive#Attributesでこれに関するAngularディレクティブのドキュメントを参照してください

于 2013-05-11T17:45:45.427 に答える