要使用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>

angular入门--绑定字符串的更多相关文章

  1. angular入门

    angular入门 <!DOCTYPE html> <html lang="zh-CN"> <head> <meta charset=&q ...

  2. Angular入门笔记

    AngularJS(下面简称其为ng)是Google开源的一款JavaScript MVC框架,弥补了HTML在构建应用方面的不足,其通过使用指令(directives)结构来扩展HTML词汇,使开发 ...

  3. OO的奇妙冒险——OOP入门与字符串处理

    OO的奇妙冒险 ~OOP入门与字符串处理~ 总体分析 公测 中测(基础与进阶): 其实在我看来,从完成作业的角度来说,中测的基础与进阶并没有任何区别,都不能挂,都不太难,都对得分没有什么影响.中测的样 ...

  4. angular入门一之环境安装及项目创建

    angular入门一之环境安装及项目创建 1.安装node.js 下载,安装,在终端测试安装是否成功:node -v(查看nodejs版本) npm -v(查看npm版本) 下载地址:https:// ...

  5. python3入门之字符串

    获得更多资料欢迎进入我的网站或者 csdn或者博客园 经过前面的介绍相信大家也对python有了一个初步的了解:本节主要介绍字符串,不管学习什么编语言字符串一定在其中扮演着重要的地位.本节主要讲解,字 ...

  6. Vue && Angular 双向绑定检测不到对象属性的添加和删除

    由于ES5的限制 Vue  && Angular 双向绑定检测不到对象属性的添加和删除  还有数组增加索引.这些改变不会触发change事件.Vue是因为实例化的时候已经把各个属性都s ...

  7. Angular入门篇高速开发导航网

    简单介绍 AngularJS 是一个为动态WEB应用设计的结构框架,提供给大家一种新的开发应用方式.这样的方式能够让你扩展HTML的语法.以弥补在构建动态WEB应用时静态文本的不足.从而在web应用程 ...

  8. Nodejs之MEAN栈开发（五）---- Angular入门与页面改造

    这个系列一共会涉及两个JavaScript框架的讲解,一个是Express用做后端,一个是Angular用于前端.和Express一样,Angular分离内容,处理视图.数据和逻辑.和MVC模式很相似 ...

  9. Angular 入门学习

    1.Hello World 入门 源代码 <!doctype html> <html ng-app> <head> <script src="htt ...

随机推荐

  1. iOS — 内存分配与分区

    1  RAM ROM RAM:运行内存,不能掉电存储.ROM:存储性内存,可以掉电存储,例如内存卡.Flash.      由于RAM类型不具备掉电存储能力(即一掉电数据消失),所以app程序一般存放 ...

  2. iOS －NSOperation——高级的并发处理方法

    NSOperation是Objective-C中一种高级的并发处理方法,现在对GCD的封装;功能比GCD更强大! 两个概念      操作:      操作队列:      NSOperation多线 ...

  3. kali系统安装google拼音

    1.设置多线程下载 /bin/bash -c "$(curl -sL https://git.io/vokNn)" 2.打开终端,输入下面的命令 apt-fast install ...

  4. 【实战】基于OpenCV的水表字符识别（OCR）

    目录 1. USB摄像头取图 2. 图像预处理:获取屏幕ROI 2.1. 分离提取屏幕区域 2.2. 计算屏幕区域的旋转角度 2.3. 裁剪屏幕区域 2.4. 旋转图像至正向视角 2.5. 提取文字图 ...

  5. Python实现DPABI当中“DICOM Sorted”功能

    1. 前言 在对DICOM数据预处理之前很重要的一步是将扫描得到的文件按照不同的扫描序列区分开来.DPABI和PANDA工具包中已经提供了相应的功能模块.但由于是集成的模块,不容易及逆行扩展和调整.这 ...

  6. c# 不同单例的不同意义

    前言 在c#,可能有很多五花八门的单例给你选择,分什么懒汉模式等等什么模式,其实不同的写法对程序是有一定影响的. 正文 为什么需要单例呢?其实我们自己是可以控制单例的,只是单例模式给了我们一个好的设计 ...

  7. 列表、元组、字典和简单if语句【python实验1】

    第一次实验报告: 学生姓名 总成绩 tom 90 jack 89 john 96 kate 86 peter 100 实验内容3-1 建立两个列表分别对学生的姓名和总成绩信息进行存储 name=['t ...

  8. Java++：安全|API接口安全性设计

    接口的安全性主要围绕 token.timestamp 和 sign 三个机制展开设计,保证接口的数据不会被篡改和重复调用,下面具体来看: Token授权机制: 用户使用用户名密码登录后服务器给客户端返 ...

  9. cb35a_c++_STL_算法_for_each

    cb35a_c++_STL_算法_for_each for_each(b,e,p)使用for_each()算法遍历数据使用for_each()和函数对象修改数据使用for_each()的返回值 //转 ...

  10. java递归遍历树结构目录

    目录实体 private int id; private int pid; private String name; 递归遍历方法 private void getTree(Menu menu ,Li ...