zoukankan      html  css  js  c++  java
  • 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>


  • 相关阅读:
    Java学习10.22(Javaweb对输入信息进行验证——常用的方法)
    mysql with python
    Linux
    Python 基础的一些习题
    Python 推导式、迭代器、生成器、模块和包
    Python 文件操作、异常
    Python 部分内置函数、作用域、闭包、递归
    Python 基础函数、解包
    Python 条件与循环
    Python 集合、字典、运算符
  • 原文地址:https://www.cnblogs.com/yek9520/p/6249536.html
Copyright © 2011-2022 走看看