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的更多相关文章

  1. AngularJS学习--- AngularJS中XHR(AJAX)和依赖注入(DI) step5

    前言:本文接前一篇文章,主要介绍什么是XHR,AJAX,DI,angularjs中如何使用XHR和DI. 1.切换工具目录 git checkout -f step- #切换分支 npm start ...

  2. AngularJS学习--- AngularJS中的模板template和迭代器过滤filter step2 step3

    1.AngularJS 模板---step2: mvc(Model-View-Controller)模式在后端用的比较多,在前端也是一样的常用; 在AngularJS中,一个视图是模型通过HTML模板 ...

  3. (九)通过几段代码，理清angularJS中的$injector、$rootScope和$scope的概念和关联关系

    $injector.$rootScope和$scope是angularJS框架中比較重要的东西,理清它们之间的关系,对我们兴许学习和理解angularJS框架都很实用. 1.$injector事实上是 ...

  4. 初次使用AngularJS中的ng-view,路由控制

    AngularJS中的route可以控制页面元素的改变,使多页面变成一个单页面 第一步:引入必要的js: <script src="js/lib/angular.js"> ...

  5. 关于AngularJs中的路由学习总结

    AngularJs中的路由,应用比较广泛,主要是允许我们通过不同的url访问不同的内容,可实现多视图的单页web应用.下面看看具体怎么使用. 关于路由  通常我们的URL形式为http://jtjds ...

  6. AngularJS学习--- AngularJS中模板链接和图像 ng-src step6

    接上一篇文章,本文将主要介绍angularjs中的模板链接,和图像显示? 首先,切换分支,启动项目: git checkout step- npm start 1.效果 相较于前一篇文章,明显感觉多了 ...

  7. Angularjs中对时间格式：/Date(1448864369815)/ 的处理

    注:本文使用的 angular 版本为 1.3 版 我们在后台对数据进行json序列化时,如果数据中包含有日期,序列化后返回到前端的结果可能是这样的: /Date(1448864369815)/  . ...

  8. 转: 理解AngularJS中的依赖注入

    理解AngularJS中的依赖注入 AngularJS中的依赖注入非常的有用,它同时也是我们能够轻松对组件进行测试的关键所在.在本文中我们将会解释AngularJS依赖注入系统是如何运行的. Prov ...

  9. AngularJS中数据双向绑定(two-way data-binding)

    1.切换工作目录 git checkout step-4 #切换分支,切换到第4步 npm start #启动项目 2.代码 app/index.html Search: <input ng-m ...

随机推荐

  1. CF336B[思维题]

    题目链接[http://codeforces.com/problemset/problem/336/B] 题意:画出2*m个圆圈,编号为1-m的圆圈在同一行相邻,编号在m+1-2*m的圆圈在同一行,有 ...

  2. [NOI2009]诗人小G --- DP + 决策单调性

    [NOI2009]诗人小G 题目描述: 小G是一个出色的诗人,经常作诗自娱自乐. 但是,他一直被一件事情所困扰,那就是诗的排版问题. 一首诗包含了若干个句子,对于一些连续的短句,可以将它们用空格隔开并 ...

  3. 工作中用到的git命令

    1.git stash 将本地的修改藏匿,不进行commit也可切换分支 2.git stash apply 将之前藏匿的修改恢复出来 3.git cherry-pick commitId git在当 ...

  4. Problem G: 切煎饼

    Description 王小二自夸刀工不错,有人放一张大的圆煎饼在砧板上,问他:饼不允许离开砧板,切100刀最多能切多少块? Input 多组测试数据,每组输入1个整数,代表切的刀数 Output 每 ...

  5. bzoj 3772

    感觉做这种题收获很大. 1.DFS序(广义上)除了用于静态子树操作,也可以用来做点到根的路上某些信息的统计(如点到根的路径上标记了多少个点),如果在加上lca,就可以支持路径的信息查询. 2.树上的可 ...

  6. CSS的flex布局(转载)

    我们之前已经学过一些布局模型,比如说浮动,绝对定位等等,但是这些布局方式一是不够简洁,而是使用的范围确实是太窄了. flex模型拥有比较多的属性,来设置多样的布局方式,接下来我们就详细介绍各种属性对布 ...

  7. tomcat使用Eclipse进行远程调试（线上调试）

    什么是远程调试,就是在A机器上利用Eclipse单步跟踪调试B机器上的Web应用,当然调试A机器上Web应用也是没有问题的,90%我都是调试本机的Web应用,远程调试的意义我想我不用说了,大家都会想到 ...

  8. 修改gnome-shell扩展“Applications Menu”的菜单区域宽度。

    sudo打开 /usr/share/gnome-shell/extensions/apps-menu@gnome-shell-extensions.gcampax.github.com/extensi ...

  9. Struts2 @ResultPath注释示例

    在Struts 2中, @ResultPath 注解用于控制Struts2找到存储的结果或JSP页面.默认情况下,它会找到结果页在 “WEB-INF/content/” 文件夹. 不知道为什么在Str ...

  10. [mark]如何删除地址栏的记录?

    比如,我输入字母a ..因为经常访问.它首先会自动帮我补填 amazon.cn 第二行出现 ali213...第三行是 alipay... 这个很简单,没必要搞得很复杂很Geek.比如楼主的情况,首先 ...