要使用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. Java实现第八届蓝桥杯分巧克力

    分巧克力 题目描述 儿童节那天有K位小朋友到小明家做客.小明拿出了珍藏的巧克力招待小朋友们. 小明一共有N块巧克力,其中第i块是Hi x Wi的方格组成的长方形. 为了公平起见,小明需要从这 N 块巧 ...

  2. 温故知新-Mysql锁&事务&MVCC

    文章目录 锁概述 锁分类 MyISAM 表锁 InnoDB 行锁 事务及其ACID属性 InnoDB 的行锁模式 注意 MVCC InnoDB 中的 MVCC 参考 你的鼓励也是我创作的动力 Post ...

  3. 白嫖永久免费云服务器教程，永久免费虚拟主机、永久免费云数据库、搭建FTP服务器、服务器安装Linux / windows操作系统、服务器部署网站、宝塔一键部署多网站、独立ip、永久国内高速云服务器

    一.准备工作 1. 注册账号 声明:切记不可用服务器做违法的事情 申请地址:https://www.sanfengyun.com/ 图文教程地址:https://www.cnblogs.com/zwn ...

  4. 利用struts2进行单个文件，批量文件上传，ajax异步上传以及下载

    利用struts2进行单个文件,批量文件上传,ajax异步上传以及下载 1.页面显示代码 <%@ page language="java" import="java ...

  5. 记一次@ResponseBody注解返回中文乱码的问题

    Bug场景 前端AJax $.ajax({ url: '$!{request.getContextPath()}/XX/save.do', type: 'post', dataType: 'json' ...

  6. 基于httpclient的一些常用方法封装

    package com.util; import java.io.IOException; import java.io.UnsupportedEncodingException; import ja ...

  7. matlab-整数规划(非线性规划之蒙特卡洛法（随机取样法）)

    首先编写M 文件mengte.m 定义目标函数f 和约束向量函数g,程序如下:function [f,g]=mengte(x);%定义目标函数f和约束向量函数g f=x()^+x()^+*x()^+* ...

  8. SpringBoot整合Hibernate Validator实现参数验证功能

    在前后端分离的开发模式中,后端对前端传入的参数的校验成了必不可少的一个环节.但是在多参数的情况下,在controller层加上参数验证,会显得特别臃肿,并且会有许多的重复代码.这里可以引用Hibern ...

  9. Domain Adaptive Faster R-CNN：经典域自适应目标检测算法，解决现实中痛点，代码开源 | CVPR2018

    论文从理论的角度出发,对目标检测的域自适应问题进行了深入的研究,基于H-divergence的对抗训练提出了DA Faster R-CNN,从图片级和实例级两种角度进行域对齐,并且加入一致性正则化来学 ...

  10. 线程基础8-quene讲解

    PriorityBlockingQueue是一个基于优先级堆的无界的并发安全的优先级队列(FIFO),队列的元素按照其自然顺序进行排序,或者根据构造队列时提供的 Comparator 进行排序,具体取 ...