<html>
<head>
<meta charset="UTF-8">
<title>title>
<script src="js/angular.min.js">script>
head>
<body ng-app>
{{100+100}}
body>
html>
DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Titletitle>
<script src="js/angular.min.js">script>
head>
<body ng-app>
请输入姓名：<input ng-model="name">
{{name}}
body>
html>
DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Titletitle>
<script src="js/angular.min.js">script>
head>
<body ng-app ng-init="name='阿三'">
姓名:<input ng-model="name" >
{{name}}
body>
html>
DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Titletitle>
<script type="text/javascript" src="js/angular.min.js">script>
<script type="text/javascript">
//定义 myApp 模板 并在body标签上使用模板
var app=angular.module('myApp',[]);
//在模板中声明控制器 并在body标签中使用控制器
app.controller('myController',function ($scope) {
//$scope 是angular js内置对象,有请求数据和响应数据 还有方法
$scope.add=function () {
return parseInt($scope.x)+parseInt($scope.y)
}
})
script>
head>
<body ng-app="myApp" ng-controller="myController">
x:<input ng-model="x">
y:<input ng-model="y">
运算结果:{{add()}}
body>
html>
DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>title>
<script type="text/javascript" src="js/angular.min.js" >script>
<script>
// 定义模块 myApp
var app = angular.module('myApp',[]);
// 定义控制器
app.controller('myController',function($scope){
$scope.add=function(){
$scope.z=parseInt($scope.x)+parseInt($scope.y);
}
});
script>
head>
<body ng-app="myApp" ng-controller="myController">
x:<input ng-model="x">
y:<input ng-model="y">
<button ng-click="add()">运算button>
结果：{{z}}
body>
html>
DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>title>
<script type="text/javascript" src="js/angular.min.js" >script>
<script>
var app=angular.module('myApp',[]);
//定义控制器
app.controller('myControler',function($scope){
$scope.lis t=[666,111,999,888];//声明数组list
});
script>
head>
<body ng-app="myApp" ng-controller="myControler">
<table>
<tr ng-repeat="liuyan in list">
<td>{{liuyan}}td>
tr>
table>
body>
html>
DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>title>
<script type="text/javascript" src="js/angular.min.js" >script>
<script>
var app=angular.module('myApp',[]);
//声明控制器
app.controller('myController',function($scope){
$scope.list=[
{name:'yanyan',salary:10000,sui:1000},
{name:'yanyan1',salary:1000,sui:100},
{name:'yanyan2',salary:100000,sui:10000}
];
});
script>
head>
<body ng-app="myApp" ng-controller="myController">
<table>
<tr>
<td>姓名td>
<td>工资td>
<td>交税td>
tr>
<tr ng-repeat="entity in list">
<td>{{entity.name}}td>
<td>{{entity.salary}}td>
<td>{{entity.sui}}td>
tr>
table>
body>
html>
<html>
<head>
<meta charset="utf-8" >
<title>入门小Demo-8 (内置服务)title>
<meta charset="utf-8" />
<script src="js/angular.min.js">script>
<script>
var app=angular.module('myApp',[]); //定义了一个叫myApp的模块
//定义控制器
//$http 主要发送http请求 ajax请求 $http.get 发送get请求
app.controller('myController',function($scope,$http){
$scope.findAll=function(){
$http.get('data.json').success(
function(response){
$scope.list=response;
}
);
}
});
script>
head>
<body ng-app="myApp" ng-controller="myController" ng-init="findAll()">
<table>
<tr>
<td>姓名td>
<td>薪水td>
<td>税td>
tr>
<tr ng-repeat="entity in list">
<td>{{entity.name}}td>
<td>{{entity.salary}}td>
<td>{{entity.sui}}td>
tr>
table>
body>
html>
date.json文件
[
{"name":"张无忌","salary":100,"sui":93},
{"name":"岩岩","salary":10022,"sui":930},
{"name":"明明","salary":100333,"sui":932},
{"name":"龙龙","salary":100666,"sui":937}
]
