Angular 四大核心特性

发布时间：2020-12-17 09:59:49 所属栏目：安全来源：网络整理

导读：!DOCTYPE htmlhtml ng-app="moduleName"headmeta charset="UTF-8"titleAngular四大核心特性/title/headbody!--1. MVCmodel:数据模型层 eg:{{hello}}view：视图层，负责展示 eg: p标签controller:业务逻辑和控制逻辑 eg:ng-controller="controllerName"2. 模

<!DOCTYPE html>
<html ng-app="moduleName">
	<head>
		<meta charset="UTF-8">
		<title>Angular四大核心特性</title>
	</head>
	<body>
		<!--
			1. MVC
			model:数据模型层 eg:{{hello}}
			view：视图层，负责展示 eg: p标签
			controller:业务逻辑和控制逻辑 eg:ng-controller="controllerName"
			
			2. 模块化(module)
			$scope': 依赖注入
			ng-app="moduleName"
			
			3. 指令系统 eg:自定义标签
			
			4. 双向数据绑定
			
		-->
		
		
		<div ng-controller="controllerName">
			<p>{{text}},Angular</p>
			<hr>
			<hello></hello>
			<hr>
			<input type="text" ng-model="name">
			<br><p>{{name}},你好</p>
		</div>
		<script src="http://apps.bdimg.com/libs/angular.js/1.4.6/angular.min.js"></script>
		<script>
			var MyModule = angular.module("moduleName",[]);
			MyModule.controller("controllerName",['$scope',function f1($scope){
					$scope.text = "hello";
				}
			]);
			MyModule.directive("hello",function(){
				return {
					restrice:'E',template:'<div>hello everyone</div>',replace: true
				}
			});
		</script>
		
	</body>
</html>

（编辑：李大同）

【声明】本站内容均来自网络，其相关言论仅代表作者个人观点，不代表本站立场。若无意侵犯到您的权利，请及时与联系站长删除相关内容!