<!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>