NetBeans 在应用的根文件夹下找到一个文件

Question

在我的项目App中，我有一个控制器，其中包含一个复杂对象，该对象具有引用App/img/blue.jpg的字段:

myApp.controller("myController",function($scope){
   $scope.message = "Home Page"; 
   $scope.Photo1 = {
       name: "blue_bird",
       image:"/img/blue.jpg"
   };
});

但是，当我这样做时，图像没有加载:

 <img src="{{Photo1.image}}" />

我还尝试将image字段更改为img/blue.jpg和~/img/blue.jpg，没有工作。但是，当我将image更改为web链接时，它可以工作

Answer 1

阅读此处的文档。

在src属性中使用{{hash}}这样的Angular标记是行不通的右:浏览器将从URL中获取文本{{hash}}直到Angular替换了{{hash}}里面的表达式。的ngSrc指令解决了这个问题。

错误的写法:

<img src="{{Photo1.image}}"/>

正确的写法:

<img ng-src="{{Photo1.image}}"/>

Answer 2

找到答案了。在窗口左侧的Projects面板中，单击Files选项卡，将文件拖到编辑区域，就在src=""属性的引号之间。然后img标签看起来像这样:

<img src="../img/blue.jpg" alt="" />

所以控制器中的对象应该是这样的:

$scope.Photo1 = {
       name: "blue_bird",
       image:"../img/blue.jpg"
   };

And in View:

<img ng-src="{{Photo1.image}}"/>