Angularjs 映射图像源时出现错误消息_Angularjs

Angularjs 映射图像源时出现错误消息

angularjs

Angularjs 映射图像源时出现错误消息,angularjs,Angularjs,我是AngularJS的新手。我昨天第一次使用它（喜欢它！），所以如果这是一个愚蠢的问题，我道歉我正在循环使用一组名为“leagues”的数据来映射我的HTML模板，没有任何问题。3个联赛的数据（包括徽标）显示正确，但是，浏览器控制台一直告诉我3个徽标不存在（如映射尚未发生…）你知道为什么会这样吗？提前谢谢错误： HTML: 您应该在图像上使用ng src指令，而不是src属性。本指令的目的正是解决您遇到的问题 [编辑] 根据为什么会发生这种情况的问题，在angular.js启动并发挥其

我是AngularJS的新手。我昨天第一次使用它（喜欢它！），所以如果这是一个愚蠢的问题，我道歉

我正在循环使用一组名为“leagues”的数据来映射我的HTML模板，没有任何问题。3个联赛的数据（包括徽标）显示正确，但是，浏览器控制台一直告诉我3个徽标不存在（如映射尚未发生…）

你知道为什么会这样吗？提前谢谢

错误：

HTML:

您应该在图像上使用

ng src

指令，而不是

src

属性。本指令的目的正是解决您遇到的问题

[编辑]

根据为什么会发生这种情况的问题，在angular.js启动并发挥其神奇作用之前，HTML会被逐字解析（带花括号），这使得浏览器抱怨

src

属性下的图像url无效。

请参阅本文

<!doctype html>
<html ng-app id="ng-app">
  <head>
      <meta charset="utf-8">
      <meta http-equiv="X-UA-Compatible" content="IE=edge">
      <script src="js/angular.min.js"></script>
      <script src="js/app.js"></script>
  </head>

  <body>
      <div id="choose-league" class="section row">
        <div ng-repeat="league in leagues">
            <div class="col-md-4 league" ng-click="getTeams(league.abbr)">
                <img id="{{league.id}}" src="{{league.logo}}" alt="{{league.id}}">
            </div>
        </div>                
      </div>  
  </body>
</html>

function dataController ($scope) {

    // Set of leagues we want data from
    $scope.leagues = [
      {id: 'champions', abbr: 'uefa.champions', logo: '/img/champions-logo.png'},
      {id: 'liga', abbr: 'esp.1', logo: '/img/liga-logo.png'},
      {id: 'premier', abbr: 'eng.1', logo: '/img/premier-logo.png'}
    ];
}