要使用angularjs,首先得下载并且在页面中调用它

先上源码

<html ng-app="app1">
<head>
<meta name="generator"
content="HTML Tidy for HTML5 (experimental) for Windows https://github.com/w3c/tidy-html5/tree/c63cc39" />
<title>angularJs Test</title>
<script src="angular.min.js"></script>
</head>
<body ng-controller='ctrl1' >
<span ng-bind='name'>aaaaaaaaaaaa</span>
<script>
var app=angular.module('app1',[]);
app.controller('ctrl1',['$scope',function($scope){
$scope.name="China";
}])
</script>
</body>
</html>

几个说明

1.ng-app代表这是一个angularJs app

2.ng-controller代表这是一个控制器,简单来讲它定义了作用域;

3.如何绑定字符串

<span ng-bind='name'>aaaaaaaaaaaa</span>
<span ng-bind-template='this is :{{name}}'>aaaaaaaaaaaa</span>

第一种方式直接绑定了scope的一个变量

第二种方式可以在绑定scope name的情况下,可以在前面加上this is:

但是无论哪种方式,都会冲掉span里面有的aaaaaaaaaaaaa内容

效果如下

第一种解析结果

第二种解析结果

其实还有第三种方式,不过这种方式当angular没有加载完时,会直接显示在页面上,简单讲页面会显示没有解析的结果,代码和效果也上吧

<span >aaaaaaaa:{{name}}</span>

最新文章

  1. iOS 网易新闻用到的框架
  2. HTML 表单
  3. Force.com微信企业号开发系列(一) - 启用二次验证
  4. Python3基础 print 输出hello world
  5. Windows Socket网络编程-2016.01.07
  6. zend studio导入thinkphp的乱码问题
  7. IOS-简单计时器的使用
  8. PHP浮点数的一个常见问题的解答
  9. 图片变换 矩阵 Bitmap Matrix
  10. java学习之多线程
  11. 无法打开 configsource 文件
  12. MySQL各模块工作配合
  13. ROS命令
  14. Redis 学习(一) —— 安装、通用key操作命令
  15. freemarker写select组件报错总结(一)
  16. java语言与jvm虚拟机简介
  17. github下载和上传项目
  18. websocket client code html
  19. iframe刷新
  20. Vuejs——(8)Vuejs组件的定义

热门文章

  1. java实现最大公约数
  2. Android 图片裁剪踩坑
  3. 如何快速修改/替换GIF的背景?
  4. beta版 tomcat 应用监控指标
  5. 安装elasticsearch的坑
  6. SpringBoot 启动配置原理
  7. Module Error (from ./node_modules/eslint-loader/index.js):解决办法
  8. FIS3安装与编译
  9. 谈谈spring-boot-starter-data-redis序列化
  10. Java 重写hashCode()与equals()