AnguarJs 监听输入字数

安果移不动

于 2018-09-12 15:43:02 发布

阅读量295

点赞数

CC 4.0 BY-SA版权

分类专栏： # angularJs

独学而无友，则孤陋寡闻。q群582951247

本文链接：https://blog.youkuaiyun.com/mp624183768/article/details/82662679

angularJs 专栏收录该内容

7 篇文章

订阅专栏

本文介绍了一个使用AngularJS创建的简单笔记应用，该应用允许用户输入并保存笔记内容，同时显示剩余可输入的字符数。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <script src="https://cdn.bootcss.com/angular.js/1.4.6/angular.min.js"></script>
    <script src="https://cdn.bootcss.com/angular.js/1.4.6/angular-animate.min.js"></script>

</head>
<body ng-app="myNoteApp" ng-controller="myNoteCtrl">
<h2>我的笔记</h2>
<textarea ng-model="message" cols="40" rows="10"></textarea>

<p>
    <button ng-click="save()">保存</button>
    <button ng-click="clear()">清除</button>
</p>
<p>剩余字数: <span ng-bind="left()"></span></p>
<script src="myNoteApp.js"></script>
<script src="myNoteCtrl.js"></script>
</body>
</html>

myNoteApp.js

var app=angular.module('myNoteApp',[])

myNoteCtrl.js

app.controller('myNoteCtrl', function ($scope) {
    $scope.message = '';
    $scope.left = function () {
        return 100 - $scope.message.length;
    }
    $scope.save = function () {
        alert('Note Saved');
    }
    $scope.clear = function () {
        $scope.message=""
    }
})