如何处理 $ctrl.在 AngularJS 中?

2023-12-25

我有一个来自 API 的方法。它返回一个解析为 $ctrl(?) 对象的承诺。该对象应包含测量值,并且每当收到新数据时就会更新。

getMeasurements.latest(filter)     //only a object to filter through all measurements
    .then(function (latestMeasurement) {
        $ctrl.latestMeasurement = latestMeasurement;
});

我的问题是我不知道如何使用这些数据或将其显示在我的 html 文件中。 $ctrl 是如何工作的?

这里的文档 http://resources.cumulocity.com/documentation/jssdk/latest/#/api/c8y.core.service:c8yMeasurements#methods_latestAPI 的


$ctrl是控制器中的视图模型对象。这个 $ctrl 是您选择的名称(vm是另一个最常见的名称),如果您检查代码,您可以看到定义为$ctrl = this;,所以基本上它是this控制器功能的关键字。

所以现在如果你正在使用$ctrl.latestMeasurement = 'someValue',那么就像您正在添加一个属性latestMeasurement到控制器功能。

现在如何在 HTML 中使用它?

要访问 HTML 中的latestMeasurement 属性,您的代码必须具有<h1>{{$ctrl.latestMeasurement}}</h1>(H1 标签只是一个示例。)

Here $ctrl与我上面在控制器部分解释的不同。这里 $ctrl 是用于的值controllerAs控制器的属性。但$ctrl是默认值controllerAs属性,所以你的代码可能没有定义controllerAs属性,所以Angular将采用默认值$ctrl在 HTML 中。

这是大多数人感到困惑的地方。那么让我解释一下,

假设在你的新控制器中你已经声明了你的this关键字到变量vm,然后你设置你的controllerAs财产给myCtrl, i.e;

controllerAs: 'myCtrl'定义控制器属性时。

var vm = this;在你的控制器功能中。

在这种情况下,在 js 中你必须使用vm用于设置值,在 HTML 中你必须使用myCtrl。例如,

在 JS 控制器函数中vm.test = 'Hello world';

in HTML <span ng-bind="myCtrl.test"></span>

结果你好世界将显示在您的页面中。

为什么是 $ctrl 而不是 $scope?

视图模型对象模型概念是在 AngularJS 1.5 中引入的,它实际上是迁移到 Angular 2 的一部分,其中 $scope 不再存在。所以在 1.5 中他们引入了新的方法,但没有完全删除 $scope。

希望答案有帮助。

对于基本的 Javascript 概念,您可以查看http://javascriptissexy.com/16-javascript-concepts-you-must-know-well/ http://javascriptissexy.com/16-javascript-concepts-you-must-know-well/

更详细的 AngularJS $ctrl 概念你可以查看https://johnpapa.net/angularjss-controller-as-and-the-vm-variable/ https://johnpapa.net/angularjss-controller-as-and-the-vm-variable/

本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)

如何处理 $ctrl.在 AngularJS 中? 的相关文章