我可以使用“this”访问自身范围内的属性吗?

时间:2021-05-19 16:57:32

I need to get the total of the following example:

我需要得到以下示例的总和:

$scope.fees = {
    basic: 1,
    premium: 2,
    total: this.basic + this.premium
}

Why won't this work? It says this is undefined. Is there a way to achieve this without having to write out total: $scope.fees.basic + $scope.fees.premium.

为什么这不起作用?它说这是未定义的。有没有办法实现这一点,而无需写出总数:$ scope.fees.basic + $ scope.fees.premium。

I'd love if there was a way to shorten it.

如果有办法缩短它,我会很高兴。

EDIT: I'd actually have to add the total property outside of $scope.fees. $scope.fees.total = ...

编辑:我实际上必须在$ scope.fees之外添加总属性。 $ scope.fees.total = ...

3 个解决方案

#1


Why this.basic doesn't work

this is evaluated in the context of the function that contains this statement. So this doesn't refer to the $scope.fees object, but to the controller.

这是在包含此语句的函数的上下文中计算的。所以这不是指$ scope.fees对象,而是指控制器。

Why total : $scope.fees.basic + $scope.fees.premium doesn't work either

At the moment that the expression $scope.fees.basic + $scope.fees.premium is evaluated the $scope.fees object doesn't exist yet, because you're in the middle of creating it. Therefore it will result in an error like "Cannot read property basic of undefined".

在评估$ scope.fees.basic + $ scope.fees.premium表达式时,$ scope.fees对象尚未存在,因为您正在创建它。因此,它将导致类似“无法读取未定义的属性”的错误。

How to solve this

There isn't any solution other than what you've already found that results in the behaviour you want, so unfortunately you'll have to stick with it.

除了你已经发现的导致你想要的行为之外,没有任何解决方案,所以不幸的是你必须坚持下去。

#2


You can use function ..

你可以使用功能..

Hello {{ total() }}
function FeeController($scope) {

    $scope.fees = {
    basic: 1,
    premium: 2,

};

  $scope.total = function() {
    return $scope.fees.basic  + $scope.fees.premium;
  };

}

#3


You might consider using the "controller as class" pattern which lessens your dependency on the $scope. You could do something like this:

您可以考虑使用“控制器作为类”模式,这样可以减少您对$ scope的依赖。你可以这样做:

app.controller('FeeCtrl', function () {
  this.basic =1;
  this.premium =2;
  this.total = this.basic + this.premium;
});

Then you can inject this controller right into your dom:

然后你可以将这个控制器注入你的dom:

<div ng-controller="FeeCtrl as fee">   
 {{ fee.total }} 
</div>

There are more detailed instructions here

这里有更详细的说明

http://toddmotto.com/digging-into-angulars-controller-as-syntax/

#1


Why this.basic doesn't work

this is evaluated in the context of the function that contains this statement. So this doesn't refer to the $scope.fees object, but to the controller.

这是在包含此语句的函数的上下文中计算的。所以这不是指$ scope.fees对象,而是指控制器。

Why total : $scope.fees.basic + $scope.fees.premium doesn't work either

At the moment that the expression $scope.fees.basic + $scope.fees.premium is evaluated the $scope.fees object doesn't exist yet, because you're in the middle of creating it. Therefore it will result in an error like "Cannot read property basic of undefined".

在评估$ scope.fees.basic + $ scope.fees.premium表达式时,$ scope.fees对象尚未存在,因为您正在创建它。因此,它将导致类似“无法读取未定义的属性”的错误。

How to solve this

There isn't any solution other than what you've already found that results in the behaviour you want, so unfortunately you'll have to stick with it.

除了你已经发现的导致你想要的行为之外,没有任何解决方案,所以不幸的是你必须坚持下去。

#2


You can use function ..

你可以使用功能..

Hello {{ total() }}
function FeeController($scope) {

    $scope.fees = {
    basic: 1,
    premium: 2,

};

  $scope.total = function() {
    return $scope.fees.basic  + $scope.fees.premium;
  };

}

#3


You might consider using the "controller as class" pattern which lessens your dependency on the $scope. You could do something like this:

您可以考虑使用“控制器作为类”模式,这样可以减少您对$ scope的依赖。你可以这样做:

app.controller('FeeCtrl', function () {
  this.basic =1;
  this.premium =2;
  this.total = this.basic + this.premium;
});

Then you can inject this controller right into your dom:

然后你可以将这个控制器注入你的dom:

<div ng-controller="FeeCtrl as fee">   
 {{ fee.total }} 
</div>

There are more detailed instructions here

这里有更详细的说明

http://toddmotto.com/digging-into-angulars-controller-as-syntax/