javascript - AngularJS - 这个演示应用程序中的函数触发器在哪里?

标签 javascript angularjs

我刚刚开始使用 AngularJS,想知道这个小型演示应用程序是如何工作的: http://www.w3schools.com/angular/angular_application.asp

完整代码如下:

<html ng-app="myNoteApp">
<script src="http://ajax.googleapis.com/ajax/libs/angularjs/1.4.8/angular.min.js"></script>
<body>

<div ng-controller="myNoteCtrl">

<h2>My Note</h2>

<p><textarea ng-model="message" cols="40" rows="10"></textarea></p>

<p>
<button ng-click="save()">Save</button>
<button ng-click="clear()">Clear</button>
</p>

<p>Number of characters left: <span ng-bind="left()"></span></p>

</div>

<script src="myNoteApp.js"></script>
<script src="myNoteCtrl.js"></script>

</body>
</html>

应用程序文件“myNoteApp.js”:

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

Controller 文件“myNoteCtrl.js”:

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

问题:left()函数是如何被触发的?

这里有一个“ng-model”数据绑定(bind)(双向数据绑定(bind)?):

<p><textarea ng-model="message" cols="40" rows="10"></textarea></p>

更新文本区域内容会触发函数“left()”吗?

<p>Number of characters left: <span ng-bind="left()"></span></p>

我不明白 AngularJS 在这里做什么...谁或什么调用了 left() 函数?

韩国, 米兰

最佳答案

每个 $digest 周期,Angular 都会更新 DOM 中的绑定(bind)。它将在作用域上调用 left() 函数来获取该值。这就是它的来源。

关于javascript - AngularJS - 这个演示应用程序中的函数触发器在哪里?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/35583469/

相关文章:

javascript - Electron 修改选项而不重新创建窗口

javascript - 在 PHP 中获取 HTML 元素

angularjs - 如何从表达式中输出 HTML unicode 字符

javascript - Android Bowser/混合应用程序模板上的 ionic Material 演示未显示

javascript - 无法编辑 Bootstrap Carousel js

javascript - 如何将 jsPDF 的文本 block 动态拆分为页面?

html - AngularJS:一个 index.html 中的注册和内容页面

angularjs - 构建混合 angular/angularjs 应用程序 - 如何在 angularjs 应用程序中加载 Angular 模块

angularjs - AngularJS 中的指令和范围

javascript - 为什么我在 Node 的 HTTP 服务器上收到这么多连接事件?