22

最近、Ionic 4 から Ionic 5 に更新しました。Ionic 5 では、アイコンも更新されました。ただし、アイコンをロードするメカニズムも変更されたようです。

Ionic 4 では、次のようなカスタム アイコンを追加できました: https://medium.com/@JordanBenge/how-to-create-custom-ionic-4-icons-af80cc6cc148

assets のアイコンフォルダに、たとえば ios-my-custom-icon.svgとmd-my-custom-icon.svgを追加します。次に、次のようにangular.jsonでそれらを参照する必要がありました。

 ...
   "assets": [
          ...
          {
            "glob": "**/*.svg",
            "input": "src/assets/icon",
            "output": "./svg"
          },
          ...
   ]
...

最終的に、html の他のイオン アイコンのように呼び出すことができます。

<ion-icon name="my-custom-icon"></ion-icon>

ただし、これは ionic 5 では機能しなくなりました。Ionic 5 でカスタム アイコンを実装する方法を知っている人はいますか?

編集: src 属性を介してそれらを呼び出すことがまだ可能であることに気付きました

<ion-icon src="assets/icon/md-my-custom-icon.svg"></ion-icon>

ただし、 name 属性を使用するのと同様に便利ではありません。上記と同等のものがある可能性はありますか？

4

5 に答える 5

5

必要に応じて、いつでも変数を使用[]してから提供できます。

const myCustomIcon = "/assets/icons/custom.svg";

そしてマークアップで：

<ion-icon [src]="myCustomIcon"></ion-icon>
于 2020-02-29T23:44:53.503 に答える