angular入门--绑定字符串

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

 

 

posted @ 2015-09-10 14:53  Ben Chan  阅读(509)  评论(0编辑  收藏  举报