zoukankan      html  css  js  c++  java
  • angular的初步使用

    <!doctype html>

    <html lang="en">
    <
    head> <meta charset = "UTF-8"> <title>angularjs 进阶</title> <script type="text/javascript" src="js/angular.min.js"></script>
    </
    head>
    <
    body ng-app = "app1"><!--代表angular这个环境--> <div ng-controller="myCtrl"> <!--代表controller--> <input type="text" ng-model = "msg"><!--model--> {{msg}}<!--model--> </div>
    </
    body> <script type="text/javascript"> angular.module('app1',[]).controller('myCtrl',function($scope){ $scope.msg = "angular" }) </script>
    </
    html> 2.方法的绑定 angular.module("app",[]).controller("myCtrl",function($scope){ $scope.msg = "liyang" $scope.reverse = function(){ return $scope.msg.split("").reverse().join("") //反转字符串 } }) <!doctype html>

    <html lang="en"> <head> <meta charset = "UTF-8"> <title>angularjs 进阶</title> </head> <body ng-app = "app"><!--代表angular这个环境--> <div ng-controller="myCtrl"> <!--代表controller--> <input type="text" ng-model = "msg"><!--model--> {{reverse()}}<!--方法的绑定--> </div> </body> <script type="text/javascript" src="js/angular.min.js"></script> <script type="text/javascript" src="js/myControl.js"></script> </html> 3.事件绑定 <!DOCTYPE html> <html> <head> <title>angular js进阶</title> <meta charset="utf-8"> <link rel="stylesheet" type="text/css" href="../css/bootstrap.min.css"> <script type="text/javascript" src="../js/angular.min.js"></script> </head> <body ng-app="app" ng-controller = "myCtr"> <input type="text" ng-model="user.name"> <input type="text" ng-model="user.pwd"> <!--模型绑定--> <div ng-click = "loginAction()">登录</div><!--事件绑定--> </body> <script type="text/javascript"> app = angular.module("app",[]); app.controller("myCtr",function($scope){ $scope.user={name:"",pwd:""} $scope.loginAction=function(){ alert($scope.user.name) } }) </script> </html>
  • 相关阅读:
    codevs 2149 矩形周长
    codevs 3044 矩形面积求并
    codevs 1293 送给圣诞夜的极光
    codevs 2806 红与黑
    codevs 1536 海战
    codevs 1262 不要把球传我
    codevs 2606 约数和问题
    BZOJ 2301 problem b
    BZOJ 3994 约数个数和
    codevs 1173 最优贸易
  • 原文地址:https://www.cnblogs.com/liyang31tg/p/5008905.html
Copyright © 2011-2022 走看看