首页 > 代码库 > angularjs 点击事件与动态追加
angularjs 点击事件与动态追加
<!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>
angularjs 点击事件与动态追加
声明:以上内容来自用户投稿及互联网公开渠道收集整理发布,本网站不拥有所有权,未作人工编辑处理,也不承担相关法律责任,若内容有误或涉及侵权可进行投诉: 投诉/举报 工作人员会在5个工作日内联系你,一经查实,本站将立刻删除涉嫌侵权内容。