NativeScript 中的本地图像未显示答案

【问题标题】：Local images in NativeScript aren't showing upNativeScript 中的本地图像未显示
【发布时间】：2018-11-08 13:54:08
【问题描述】：

我只是在学习，现在有一个非常简单的页面。就是这样：

<GridLayout>
    <Label class="m-10 h3" verticalAlignment="top" [text]="team.fields.team.stringValue"></Label>
    <Image [src]="myImageSrc" stretch="none"></Image>
</GridLayout>

当我在此处的 init 函数中进入页面时，源会更新：

ngOnInit(): void {
    this.team = this.data.getHomeTeam();
    this.myImageSrc = "~/images/" + this.team.fields.team.stringValue + ".png";
}

而且我所有的图片都出现在我认为它们应该出现的地方：

但由于某种原因，这不起作用，当我转到它时，页面上什么也没有显示。对于我的生活，我无法弄清楚为什么不是，我见过的所有示例都使用这种确切的方法。

【问题讨论】：

不知道为什么这被否决了？这是我遇到的合法问题，所以这很酷......
你能用 chrome 调试控制台元素检查器检查 Image 元素的“src”标签吗？
它对我来说效果很好，即使只使用tns run [ios|android] 或 webpack + uglify + aot 也是如此。我正在运行最新的 CLI 和运行时。你有示例项目的仓库吗？
您是否尝试在图像上设置width 和height？您不应该使用这样的 GridLayout，如果您不想提供列和行属性，请使用 StackLayout。
代码对我来说看起来不错。尝试在控制台上打印图像路径并检查该图像路径是否确实存在。您还可以参考现有的 Angular 示例项目 market.nativescript.org/…

标签： angular nativescript angular2-nativescript

【解决方案1】：

您的图片名称中有空格。这可能是个问题。您是否尝试过更改它们的名称，而不是“My Image.png”，而是将其命名为“MyImage.png”？如果不能，如何将 ' 添加到源路径，以便将其视为完整路径：

this.myImageSrc = "'~/images/" + this.team.fields.team.stringValue + ".png'";

【讨论】：