17

次のような HTML を書きたいと思います。

<a href="sharedasset: img.png">test</a>
<img src="sharedasset: img.png"/>

また、「sharedasset」と呼ばれるimg.pngディレクティブを使用して、ディレクティブが事前に属性名を認識しなくても、属性の値を完全パスで取得して設定します。これは可能ですか？

アップデート

最初にこれを投稿して以来、Angular にはいくつかの改善がありました。その結果、現在行っていることを共有したいと思います。HTML では、フィルターを作成するという Guido Bouman の回答を使用しています。Angular のbind once機能により、これが私の意見では最良の選択肢になります。

ただし、JS コードでは、どこにでも定数を挿入する代わりに$filter、静的コンテンツ サーバーでホストされているアセットの任意のパスにglobalVars単語を追加し、Angular HTTP インターセプターを使用して、で始まる任意のパスを探します。 "static" に変更し、静的サーバーのドメインに置き換えます。とてもシンプルです。static{templateUrl: "static/someTemplate.html"}

4

3 に答える 3

57 
<a full-path="img.png">test</a>
<img full-path="img.png">


app.directive('fullPath', function() {
    return {
        link: function(scope, element, attrs) {
            var fullPathUrl = "http://.../";
            if(element[0].tagName === "A") {
                attrs.$set('href',fullPathUrl + attrs.fullPath);
            } else {
                attrs.$set('src',fullPathUrl + attrs.fullPath);
            }
        },
    }
});

あなたがどこから来ているのかわからないfullPathUrlので、リンク関数にハードコーディングしました。

于 2013-08-13T21:22:33.337 に答える
8

A custom filter is much more suited for this case than a directive:

<a href="{{'images/img.png' | fullPath}}">test</a>
<img src="{{'images/img.png' | fullPath}}" />

The filter: (Assuming you have a global filters module)

angular.module('filters').filter('fullPath', function(globalVars) {
  return function(url) {
    return globalVars.staticWebsite + "/app/styles/main/" + url + "?build=" + globalVars.buildNumber;
  };
});
于 2014-12-08T13:02:48.340 に答える