<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
<script type="text/javascript" src="js/angular.min.js"></script>//引入angular js
</head>
<body>
<div ng-app="myApp" ng-controller="myCtrl">
<input type="text" ng-model="name" /><br />
<button ng-click="toggle()">点我</button>
</div>
<script type="text/javascript">
var app=angular.module("myApp",[]);
app.controller(‘myCtrl‘,function($scope){
$scope.toggle=function(){
alert($scope.name);
}
})
</script>
</body>
</html>
点击事件要加括号
<button ng-click="可随意命名()">点我</button> 获取到值的时候要加$scope $scope 必须加不可更改
alert($scope.name);
动态追加
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
<script type="text/javascript" src="js/angular.min.js">
</script>
</head>
<body>
<div ng-app="myApp" ng-controller="namesCtrl">
<input type="text" ng-model=‘name‘ /><br />
<input type="text" ng-model=‘d‘ /><br />
<button ng-click="dj()">添加</button>
<ul>
<li ng-repeat="x in list">
{{x.name+‘,‘+x.title}}
</li>
</ul>
</div>
<script type="text/javascript">
angular.module("myApp",[]).controller(‘namesCtrl‘,function($scope){
$scope.list = [
{name:‘html‘,title:‘html5‘},
{name:‘css‘,title:‘css3‘},
{name:‘js‘,title:‘jquery‘}
];
$scope.dj=function(){
var i={
name:$scope.name,
title:$scope.d
};
$scope.list.push(i);
};
});
</script>
</body>
</html>
时间： 2024-10-29 03:31:23