<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
<script src="js/angular.min.js" type="text/javascript" charset="utf-8"></script>
</head>
<body>
<!--ng-controller="myctrl 定义一个控制器-->
<div ng-app="myapp" ng-controller="myctrl">
<fieldset id="">
<legend>案例1</legend>
<p>姓：<input type="text" ng-model="firstName"/></p>
<p>名：<input type="text" ng-model="lastName"/></p>
<p>姓名是：{{firstName+lastName}}</p>
<p>(通过调用方法)姓名是：{{getFullName()}}</p>
</fieldset>
<fieldset id="">
<legend>案例2</legend>
<p><input type="text" ng-model="name"/><button ng-click="getName()">点击试试</button></p>
<h3>{{greeting}}</h3>
</fieldset>
<fieldset id="">
<legend>案例3</legend>
<ul><li ng-repeat="x in mynames">{{x}}</li></ul>
<p>{{xing}} 氏家族如下：</p>
<ol><li ng-repeat="x in mynames1">{{x}}-----------{{xing}}</li></ol>
</fieldset>
<fieldset id="">
<legend>案例4</legend>
<p>{{cars.name+":"+cars.color}}</p>
</fieldset>
</div>
<script type="text/javascript">
//1.得到Angular应用模块
var myapp=angular.module("myapp",[]);
//2.设置它的控制器 $scope作用域
myapp.controller("myctrl",function($scope){
//初使化变量
$scope.firstName="李";
$scope.lastName="小明";
//定义一个方法
$scope.getFullName=function(){
//变量名前一定要加上$scope
return $scope.firstName+$scope.lastName;
};
$scope.name="刘亦菲";
$scope.getName=function(){
//给11
变量来赋值
$scope.greeting="欢迎你，"+$scope.name;
}
//定义数组
$scope.mynames=["张三","李四","王五"];
$scope.xing="张";
$scope.mynames1=["一","二","三"];
//定义对象
$scope.cars={name:"公交车",color:"绿色"};
});
</script>
</body>
</html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
<script src="js/angular.min.js" type="text/javascript" charset="utf-8"></script>
</head>
<body>
<!--ng-controller="myctrl 定义一个控制器-->
<div ng-app="myapp" ng-controller="myctrl">
<fieldset id="">
<legend>案例1</legend>
<p>姓：<input type="text" ng-model="firstName"/></p>
<p>名：<input type="text" ng-model="lastName"/></p>
<p>姓名是：{{firstName+lastName}}</p>
<p>(通过调用方法)姓名是：{{getFullName()}}</p>
</fieldset>
<fieldset id="">
<legend>案例2</legend>
<p><input type="text" ng-model="name"/><button ng-click="getName()">点击试试</button></p>
<h3>{{greeting}}</h3>
</fieldset>
<fieldset id="">
<legend>案例3</legend>
<ul><li ng-repeat="x in mynames">{{x}}</li></ul>
<p>{{xing}} 氏家族如下：</p>
<ol><li ng-repeat="x in mynames1">{{x}}-----------{{xing}}</li></ol>
</fieldset>
<fieldset id="">
<legend>案例4</legend>
<p>{{cars.name+":"+cars.color}}</p>
</fieldset>
</div>
<script type="text/javascript">
//1.得到Angular应用模块
var myapp=angular.module("myapp",[]);
//2.设置它的控制器 $scope作用域
myapp.controller("myctrl",function($scope){
//初使化变量
$scope.firstName="李";
$scope.lastName="小明";
//定义一个方法
$scope.getFullName=function(){
//变量名前一定要加上$scope
return $scope.firstName+$scope.lastName;
};
$scope.name="刘亦菲";
$scope.getName=function(){
//给11
变量来赋值
$scope.greeting="欢迎你，"+$scope.name;
}
//定义数组
$scope.mynames=["张三","李四","王五"];
$scope.xing="张";
$scope.mynames1=["一","二","三"];
//定义对象
$scope.cars={name:"公交车",color:"绿色"};
});
</script>
</body>
</html>
扫一扫
1361
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
