0

当您绑定到 AngularJS 中的函数时，谁能解释幕后发生的事情？它创造了什么样的手表？我有一种感觉，它会为构成返回值的每个属性创建两个手表（在下面的示例中）。但是我当然不确定这一点，但感觉像是我们不应该做的事情。

例如

<div ng-show="vm.someFunc()">

JS

vm.someFunc = function() {  
    return vm.property1 || vm.property2;
}
4

2 回答 2

1

如果您创建了角度范围方法“vm.someFunc()”，它将不断被轮询。您可以通过在此方法中设置断点来验证这一点，它将不断被命中。如果您检查任务管理器并显示运行您网站的浏览器，则内存会不断增加并且不会停止。

在我看来，范围函数应该只在使用事件触发器时使用：点击事件、更改事件、按键是一些例子。

显示或隐藏不是事件，所以这就是它被这样轮询的原因。要修复并提供相同的功能，请将其转换为范围变量。
将html标签从：

<div ng-show="vm.someFunc()">

至

<div ng-show="vm.someFunc">

在你的控制器中：

$scope.KeyPressed = false;
$scope.Tags = '';

然后针对您要观看的内容创建一个观看事件：

//initialize showtag when page loads
$scope.vm.someFunc = $scope.KeyPressed && $scope.Tags !== '';

//watch for any new changes on keypressed
$scope.$watch('KeyPressed', function (newValue, oldValue) {
     if (newValue && $scope.Tags !== '') {
         $scope.vm.someFunc= true;
     } else {
         $scope.vm.someFunc= false;
     }
}

//watch for any new changes on keypressed
$scope.$watch('Tags', function (newValue, oldValue) {
     if (newValue !== "" && $scope.KeyPressed) {
         $scope.vm.someFunc= true;
     } else {
         $scope.vm.someFunc= false;
     }
}

或者您可以更改为“watchCollection”而不是拥有多个手表，例如：

$watchCollection('[KeyPressed, Tags]', function (newValue) { }

newValue[0]是KeyPressed的值，newValue[1]是Tags的值

或者遵循公认的答案并尽量减少手表的数量：

$scope.TruthyVal= function () {
    return $scope.KeyPressed && $scope.Tags !== '';
};

$scope.$watch('TruthyVal', function (newValue, oldValue) {
     if (newValue) {
         $scope.vm.someFunc= true;
     } else {
         $scope.vm.someFunc= false;
     }
}
于 2016-05-13T15:12:20.723 回答
0

事实上，angular 并不关心你在 html 中写的内容——函数、变量或其他任何东西。它将表达式作为字符串，对其进行解析并在每个摘要循环中计算其值。所以，并且{{1 + 2}}实际上以或多或少相同的速度做同样的工作。{{sum(1, 2)}}{{1 | sum:2}}

这三种方式都是合法的，不会造成内存泄漏。

在 ng-show 中总是不推荐使用函数的原因是很多函数很耗时，所以你的消化变得很慢。即使你的函数很快，你也不能保证它们将来不会长大。

于 2016-05-13T15:49:17.523 回答