AngularJS(十)src和href處理

轉載地址:http://www.cnblogs.com/liulangmao/p/3719162.html


本篇主要介紹angular中圖片的src和鏈接的href的處理:

用到了以下兩個屬性:

ng-src: 綁定了數據的路徑表達式

ng-href: 綁定了數據的路徑表達式

例如: 

複製代碼
<!DOCTYPE html>
<html ng-app>
<head>
  <title>7.1src和href</title>
  <meta charset="utf-8">
  <script src="../angular.js"></script>
  <script src="script.js"></script>
  <style type="text/css">
    *{
      font-family:'MICROSOFT YAHEI';
      font-size:12px
    }
  </style>
</head>
<body>
<div ng-controller = "SrcHref">
  <img ng-src="./images/cats/{{favorite}}"/>
  <a ng-href="./images/cats/{{favorite}}">查看</a>
</div>
</body>
</html>
複製代碼
function SrcHref ($scope){
    $scope.favorite = 'xiaohei.gif';
}

顯示效果:

點擊查看後會跳轉到圖片的路徑

 

*雖然說,使用這種方法也能綁定路徑:

  <img src="./images/cats/{{favorite}}"/>
  <a href="./images/cats/{{favorite}}">查看</a>

但這不是最佳方法,有時候會無法運行.原因不需要去理解.記住就可以了.

 

 

 

發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章