angular双向绑定事件demo

最新推荐文章于 2024-05-16 11:43:27 发布

原创最新推荐文章于 2024-05-16 11:43:27 发布 · 234 阅读

0 ·

CC 4.0 BY-SA版权

文章标签：

#angularjs

笔记同时被 2 个专栏收录

18 篇文章

订阅专栏

java

9 篇文章

订阅专栏

本文介绍了一个使用AngularJS框架实现的简易计算器项目。该计算器通过HTML页面接收用户输入的两个数值，并利用AngularJS提供的双向数据绑定特性及控制器方法完成两数相加的操作。此示例适合AngularJS初学者学习。

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <!--引入angular.min.js-->
    <script src="js/angular.min.js"></script>
    <script>
        /*初始化模块*/
        var app = angular.module("myApp",[])
        /*设置控制器*/
        app.controller('myController',function ($scope) {
            /*定义方法*/
            $scope.add = function () {
                $scope.c = parseInt($scope.a) + parseInt($scope.b);
            }
        })
    </script>
</head>
<body ng-app="myApp" ng-controller="myController">
    a:<input type="text" ng-model="a">
    b:<input type="text" ng-model="b">
    <button ng-click="add()">求和</button>
    两数和为：{{c}}
</body>
</html>