angularjs中的ng-src和ng-href
ng-src和ng-href等同于html中的src和href，只是ng是在dom加载完毕之后才能够发挥作用，如果在src或href中绑定变量，如果ng没有加载完，会导致链接地址出错，如果用对应的ng-src或ng-href，则不会出现这个问题。下面是一段示例代码：
<!DOCTYPE html>
<html ng-app="myApp">
<head>
<meta charset="UTF-8">
<title>interval</title>
<script type="text/javascript" src="angular.min.js" charset="utf-8"></script>
</head>
<body ng-controller="ctrl"> <div><a ng-href="NewFile3_{{i}}.htm">链接</a></div>
<div><input type="button" ng-click="clickEvent(1)" value="切换链接1" /><input type="button" ng-click="clickEvent(2)" value="切换链接2" /><input type="button" ng-click="clickEvent(3)" value="切换链接3" /></div>
<script type="text/javascript">
var myApp = angular.module('myApp',[]);
myApp.controller('ctrl', function($scope){
$scope.i = 1;
$scope.clickEvent = function(index) {
$scope.i = index;
}
});
</script>
</body>
</html>
angularjs中的ng-src和ng-href的更多相关文章
- AngularJS学习--- AngularJS中XHR(AJAX)和依赖注入(DI) step5
前言:本文接前一篇文章,主要介绍什么是XHR,AJAX,DI,angularjs中如何使用XHR和DI. 1.切换工具目录 git checkout -f step- #切换分支 npm start ...
- AngularJS学习--- AngularJS中的模板template和迭代器过滤filter step2 step3
1.AngularJS 模板---step2: mvc(Model-View-Controller)模式在后端用的比较多,在前端也是一样的常用; 在AngularJS中,一个视图是模型通过HTML模板 ...
- (九)通过几段代码，理清angularJS中的$injector、$rootScope和$scope的概念和关联关系
$injector.$rootScope和$scope是angularJS框架中比較重要的东西,理清它们之间的关系,对我们兴许学习和理解angularJS框架都很实用. 1.$injector事实上是 ...
- 初次使用AngularJS中的ng-view,路由控制
AngularJS中的route可以控制页面元素的改变,使多页面变成一个单页面 第一步:引入必要的js: <script src="js/lib/angular.js"> ...
- 关于AngularJs中的路由学习总结
AngularJs中的路由,应用比较广泛,主要是允许我们通过不同的url访问不同的内容,可实现多视图的单页web应用.下面看看具体怎么使用. 关于路由 通常我们的URL形式为http://jtjds ...
- AngularJS学习--- AngularJS中模板链接和图像 ng-src step6
接上一篇文章,本文将主要介绍angularjs中的模板链接,和图像显示? 首先,切换分支,启动项目: git checkout step- npm start 1.效果 相较于前一篇文章,明显感觉多了 ...
- Angularjs中对时间格式：/Date(1448864369815)/ 的处理
注:本文使用的 angular 版本为 1.3 版 我们在后台对数据进行json序列化时,如果数据中包含有日期,序列化后返回到前端的结果可能是这样的: /Date(1448864369815)/ . ...
- 转: 理解AngularJS中的依赖注入
理解AngularJS中的依赖注入 AngularJS中的依赖注入非常的有用,它同时也是我们能够轻松对组件进行测试的关键所在.在本文中我们将会解释AngularJS依赖注入系统是如何运行的. Prov ...
- AngularJS中数据双向绑定(two-way data-binding)
1.切换工作目录 git checkout step-4 #切换分支,切换到第4步 npm start #启动项目 2.代码 app/index.html Search: <input ng-m ...
随机推荐
- iTerm2配置
1.颜色Solarized 首先下载 Solarized: $ git clone git://github.com/altercation/solarized.git Terminal/iTerm2 ...
- dp洋洋散散的知识+code
/*在数轴上有0-N的位置 从0出发每次可以向右走 2 23 233步*/ // 1 总共的方案数 f[i]=f[i-]+f[i-]+f[i-]; f[]=; ;a<=n;a++) { ) f[ ...
- [BZOJ4237]稻草人(CDQ分治)
先按y排序,二分,两边递归下去,然后处理下半部分对上半部分的贡献,即左下点在下半部分,右上点在上半部分的合法矩形个数. 两个部分均按x排序,枚举右上点p,则左下点需要满足: 1.横坐标大于上半部分纵坐 ...
- 密码加密_md5
md5加密 package com.fh.util; import java.security.MessageDigest; public class MD5 { public static Stri ...
- asp.net mvc4 简单使用Autofac依赖注入小结
1,首先使用 NuGet下载适当的Autofac版本 文件一,Autofac.3.5.2 文件二,Autofac.Mvc4.3.1.0 1,接口类 public interface IReposito ...
- 2015 UESTC 数据结构专题D题 秋实大哥与战争 变化版本的线段树，合并区间，单点查询
D - 秋实大哥与战争 Time Limit: 1 Sec Memory Limit: 256 MB 题目连接 http://acm.uestc.edu.cn/#/contest/show/59 D ...
- hihocoder155周 任务分配
时间限制:10000ms 单点时限:1000ms 内存限制:256MB 描述 给定 N 项任务的起至时间( S1, E1 ), ( S2, E2 ), ..., ( SN, EN ), 计算最少需要多 ...
- Trigger a TTL circuit from ECL levels
ECL circuits typically have relatively small logic spans of approximately 800 mV. Because of the sma ...
- gitignore / Delphi.gitignore
https://github.com/github/gitignore/blob/master/Delphi.gitignore *.dcu *.~*~ *.local *.identcache __ ...
- VirtualBox 4.3.18 启动虚拟机时显示不能加载 R3模块并退出故障解决一例
VirtualBox 升级到 4.3.1x后一直问题不断.搜了些资料,发现这货从最近的某个版本开始,为了安全,要校验进程完整性,那些在运行时要注入Virtualbox进程的模块都要进行校验.于是乎出现 ...