ionic应用程序无法在android中呈现svg文件，但适用于ios

Question

I'm really new to hybrid web apps and I'm currently trying to build an app that will allow me to display a number of svg files as ion-list items from an ng-repeat. Now I initially had an issue displaying these in my emulator until instead of using an image tag I used a div with an ng-include and a link to the url of the image. This works fine in the Ripple emulator and it also works fine when I'm serving the app via phonegap to an ios device, but for android it doesn't render the images.

Does anyone have any idea why?

Answer 1

Thanks to Paul LeBeau for his question, it pointed me in the right direction to solve this issue.

I added the type="image/svg+xml" attribute to a html object element to resolve this issue.

Answer 2

SVG background images referenced in css also didn't show up under ios in my case. But they will render correctly if set as a data attribute inline:

background: url('data:image/svg+xml;utf8,<svg ...> ... </svg>');

More info on the topic here: https://css-tricks.com/probably-dont-base64-svg/