javascript - 关于AngularJS中数据绑定(bind)的疑问

标签 javascript angularjs

我正在通过使用 AngularJS 制作我的第一个应用程序来学习 AngularJS。到目前为止,一切正常,我很兴奋:)

但现在我的 console.log 完全让我困惑,我开始认为我完全错过了一些东西。

我有一个绑定(bind)到 Controller 的简单标签:

<h2 ng-controller='HeaderController' ng-show='data.actualSection > 0'>
    {{titleForSection()}}
</h2>

Controller 非常简单:

    uxctModule.controller ('HeaderController', function ($scope, ModelData){
    $scope.data = ModelData;

    $scope.titleForSection = function () {
        console.log ("RETURNING IT");
        return ("I SHOULD RETURN YOU SOMETHING");
    }
});

真正让我困惑的是,我注意到每次模型中发生变化时,都会触发该函数。 Controller 如何在没有 $watch 的情况下持续执行该函数?

最佳答案

Angular 中的数据绑定(bind)是通过摘要循环完成的,这意味着 Angular 会一遍又一遍地循环检查更改,如果是绑定(bind)到该函数的函数,则必须评估该函数以查找更改。

这就是将 UI 绑定(bind)到函数结果通常不是一个好主意的原因。 相反,你应该这样做:

标记:

<h2 ng-controller='HeaderController' ng-show='data.actualSection > 0'>
    {{sectionTitle}}
</h2>

Controller :

$scope.sectionTitle = 'I SHOULD RETURN YOU SOMETHING';
//and update it dynamically
$scope.funcToUpdateTitle = function(newTitle){
    $scope.sectionTitle = newTitle;
};

关于javascript - 关于AngularJS中数据绑定(bind)的疑问,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/23477506/

相关文章:

javascript - 帮助可折叠的 Div(为显示/隐藏状态添加图像)

javascript - 我的叠加层将页面的其余部分向下推而不是出现在顶部

angularjs - 如何在 Angular ui 网格中禁用编辑排序

javascript - Angular 2如何连接生产文件

angularjs - Ng-animate不添加ng-enter和ng-leave类

javascript - Discord.js setGame() 不再工作

javascript - 如何使用 document.msFullscreenElement !== null(使用 javascript)检测全屏

AngularJS - 过滤数据时更新.length

javascript - parse.com promise - 我需要在每个 "error"中有一个 "then"函数吗?

javascript - 对 AngularJS 指令进行故障排除