zoukankan      html  css  js  c++  java
  • angular学习笔记(十)-src和href处理

    本篇主要介绍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>

    但这不是最佳方法,有时候会无法运行.原因不需要去理解.记住就可以了.

  • 相关阅读:
    2019-04-02 cast and covert
    2019-04-01 为什么零售业务流行起来了?
    2019-04-01 银行的零售业务和对公业务
    服务器推送更新
    webpack 大概
    webpack
    react Hooks
    react 表单受控和非受控
    eslint规则
    react系列笔记:第三记-redux-saga
  • 原文地址:https://www.cnblogs.com/liulangmao/p/3719162.html
Copyright © 2011-2022 走看看