要使用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. 大话计算机网络一 聊聊UDP

    引言 UDP是一个简单的面向数据报的运输层协议 UDP不提供可靠性,它把应用程序传给IP层得数据发送出去,不保证它们能达到目的地 UDP首部 端口号表示发送进程和接受进程. UDP长度字段指的是UDP ...

  2. 5、react-路由

    1.单页面:(只有一个index.html)(为什么要使用react-router再react中) 所有的组件都是再同一个index.html中进行显示的,它再显示的时候是怎么显示的,通过你点击的连接 ...

  3. OSI模型各层详解

    1. OSI概述 1.1 模拟器说明 1.1.1 模拟器的作用 搭建实验环境进行测试. 1.1.2 模拟器的类型 PT:一般是学校中使用,命令不完整,且不能抓包 GNS3:思科(CCNA,CCNP), ...

  4. 14.Django-JWT

    一.基于JWT的Token登录认证 1. JWT简介 json Web Token(缩写JWT)是目前最流行的跨域认证解决方案 session登录的认证方案是看,用户从客户端传递用户名和密码登录信息, ...

  5. （二）HttpClient Post请求

    原文链接:https://blog.csdn.net/justry_deng/article/details/81042379 POST无参: /** * POST---无参测试 * * @date ...

  6. 为避免种族歧视，谷歌Chrome将不再使用“黑名单”等词

    GitHub 15.2k Star 的Java工程师成神之路,不来了解一下吗! GitHub 15.2k Star 的Java工程师成神之路,不来了解一下吗! 近日,美国黑人乔治‧佛洛伊德(Georg ...

  7. 淘宝官网css初始化

    body, h1, h2, h3, h4, h5, h6, hr, p, blockquote, dl, dt, dd, ul, ol, li, pre, form, fieldset, legend ...

  8. 一个老牌程序员说：做Java开发，怎么可以不会这 20 种类库和 API

  9. .NET Core Hangfire周期性作业调度问题

    前言 四月中旬Hangfire团队发布了1.7.11版本,在使用周期性作业调度过程中发现一个问题,这个问题应该一直未解决,故做此记录,希望遇到的童鞋根据项目业务而避开这个问题. 周期性作业调度 我们依 ...

  10. ssh生成单个公钥

    ssh生成单个公钥命令: ssh-keygen -t rsa -b 4096 -C "your_email@example.com" 查看公钥: cat ~/.ssh/id_rsa ...