AngularJS基础 ng-href 指令用法
AngularJS ng-href 指令
AngularJS 实例
使用 AngularJS 设置添加链接:
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <script src="http://apps.bdimg.com/libs/angular.js/1.4.6/angular.min.js"></script> </head> <body ng-app=""> <div ng-init="myVar = 'http://www.runoob.com'"> <h1>菜鸟教程</h1> <p>访问 <a ng-href="{{myVar}}">{{myVar}}</a> 学习!</p> </div> <p>该实例可以使用了原生的 href 属性,但在 AngularJS 中, ng-href 属性更安全。</p> </body> </html>
定义和用法
ng-href 指令覆盖了原生的 <a> 元素 href 属性。
如果在 href 的值中有 AngularJS 代码,则需要使用 ng-href 而不是 href。
ng-href 指令确保了链接是正常的,即使在 AngularJS 执行代码前点击链接。
语法
<a ng-href="string"></a>
<a> 元素支持该指令。
参数值
值 | 描述 |
---|---|
expression | 字符串,表达式的执行结果 |
以上就是对AngularJS no-href资料的整理,后续继续补充,希望能帮助学习AngularJS的同学。
相关推荐
-
AngularJS基础 ng-hide 指令用法及示例代码
AngularJS ng-hide 指令 AngularJS 实例 在复选框选中时隐藏一部分: <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <script src="http://apps.bdimg.com/libs/angular.js/1.4.6/angular.min.js"></script> </head> &
-
AngularJs自定义服务之实现签名和加密
写在前面: AngularJS 是一个 JavaScript 框架.它可通过 <script> 标签添加到 HTML 页面. AngularJS 通过 指令 扩展了 HTML,且通过 表达式 绑定数据到 HTML. angularJS是google公司主推的js开发优秀框架... 页面展示: 在应用中进行加密是普遍存在的,个人建议在前端实现加密签名(前端加密是否必要来自知乎:http://www.zhihu.com/question/25539382) 对base64.md5.sha1加密算法
-
AngularJS基础 ng-focus 指令简单示例
AngularJS ng-focus 指令 AngularJS 实例 当输入框获取焦点时执行表达式: <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <script src="http://apps.bdimg.com/libs/angular.js/1.4.6/angular.min.js"></script> </head>
-
AngularJS基础 ng-include 指令示例讲解
AngularJS ng-include 指令 AngularJS 实例 包含 HTML 文件: <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <script src="http://apps.bdimg.com/libs/angular.js/1.4.6/angular.min.js"></script> </head>
-
AngularJS控制器之间的数据共享及通信详解
AngularJS 本身已经提供了像指令 Directive 和 服务 Service 一类的方式,来实现数据和代码的共享和复用,但在实际的项目开发中,或许是处于懒惰,亦或是为了便利,总会想在两个控制器之间,直接进行数据的共享通信,或者是函数与方法的调用,这里我们就看看有哪些方法可以满足这个要求. 单例服务 单例服务是 AngularJS 本身支持的数据和代码共享方式,因为是单例的,所有的控制器访问的便是同一份数据.比如,下面的 Service 便可以实现: angular .module('a
-
AngularJS基础 ng-if 指令用法
AngularJS ng-if 指令 AngularJS 实例 取消选中,并移除内容: <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <script src="http://apps.bdimg.com/libs/angular.js/1.4.6/angular.min.js"></script> </head> <b
-
AngularJS基础 ng-include 指令简单示例
AngularJS ng-include 指令 AngularJS 实例 包含 HTML 文件: <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <script src="http://apps.bdimg.com/libs/angular.js/1.4.6/angular.min.js"></script> </head>
-
AngularJS基础 ng-keydown 指令简单示例
AngularJS ng-keydown 指令 AngularJS 实例 按下按键时执行的代码: <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <script src="http://apps.bdimg.com/libs/angular.js/1.4.6/angular.min.js"></script> </head>
-
AngularJS基础 ng-disabled 指令详解及简单示例
AngularJS ng-disabled 指令 AngularJS 实例 禁用或启用输入框: <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <script src="http://apps.bdimg.com/libs/angular.js/1.4.6/angular.min.js"></script> </head> &
-
AngularJS基础 ng-init 指令简单示例
AngularJS ng-init 指令 AngularJS 实例 初始化应用时创建一个变量: <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <script src="http://apps.bdimg.com/libs/angular.js/1.4.6/angular.min.js"></script> </head> &
随机推荐
- 浅谈MySQL和mariadb区别
- springMVC结合AjaxForm上传文件
- 详解JavaScript常量定义
- ASP.NET数据库存取图片的方法
- php更新mysql后获取影响的行数发生异常解决方法
- 用asp+xmlhttp编写web采集程序
- C#实现文件上传下载Excel文档示例代码
- Docker Registry 私有仓库搭建详细步骤
- javaScript使用EL表达式的几种方式
- Python判断文本中消息重复次数的方法
- python基础教程之udp端口扫描
- Python使用scrapy采集数据时为每个请求随机分配user-agent的方法
- C#子线程执行完后通知主线程的方法
- PHP编程获取图片的主色调的方法【基于Imagick扩展】
- 详解java整合solr5.0之solrj的使用
- sqlserverdriver配置方法 jdbc连接sqlserver
- MsSql 存储过程分页代码 [收集多篇]
- javascript简单实现类似QQ头像弹出效果的方法
- jquery实现删除一个元素后面的所有元素功能
- jQuery html表格排序插件tablesorter使用方法详解