Czy operator trójskładnikowy zostanie wykonany przy każdym streszczeniu?

Question

Jeśli używam operatora trójskładnikowego w moim widoku Angular.js, będzie on wykonywany na każdym streszczeniu (podobnie jak funkcje) lub tylko wtedy, gdy zmienne niezbędne do decyzji zostaną zmienione?

Przykład:

<div>{{ui.isTrue ? "foo" : "bar"}}</div> 

czyli

<div ng-bind="ui.isTrue ? 'foo' : 'bar'"></div> 

byłoby realizowane na każdy strawienia lub tylko wtedy, gdy jest ui.IsTrue zmieniło?

Answer 1

Zrobiłem skrzypce przetestować ten siebie.

http://jsfiddle.net/xuvzzay8/4/

HTML:

<div ng-controller="MyCtrl">  
    {{bool ? ternaryTrue() : ternaryFalse() }}<br/> 

    {{bool}}<br/>   
    <button ng-click="bool = !bool">Toggle Bool</button> 
    {{a}} 
    <div style="background-color:red" ng-mouseover="hover()"> 
     Hover here to trigger digest 
    </div> 
</div> 

JS:

var myApp = angular.module('myApp',[]); 
function MyCtrl($scope) {  
    $scope.bool = true; 
    $scope.a = 0; 
    $scope.ternaryTrue = function(){ 
     console.log("ternary executed on true"); 
    } 
    $scope.ternaryFalse = function(){ 
     $scope.a++; //creates an infinite digest loop 
     console.log("ternary executed on false"); 
    }  
    $scope.hover = function(){ 
     console.log("Hover"); 
    } 
} 

Rezultatem jest to, że operator trójargumentowy jest wykonywany na każdym Digest.

Edycja: W ten sposób można łatwo utworzyć pętlę nieskończonego skrótu. Jak tylko coś w $ scope zostanie zmienione podczas funkcji, która jest wywoływana przez potrójnego operatora, uruchomione zostanie kolejne podsumowanie, które ponownie uruchamia funkcję operatora trójskładnikowego itd.

Answer 2

W angularjs każdy wyraz w tym operatora potrójnego zostanie wykonany:

• pierwsze, gdy strona jest ładowana.
• I kiedykolwiek zmienna ui.isTrue zostanie zmieniona w aplikacji kątowej scope.

Jeśli przyjrzeć angular scope documentation a szczególnie zakres jak Danych modelu sekcji, widać, że:

Zakres jest klej pomiędzy kontrolerem aplikacji i widoku. Podczas fazy łączenia szablonów dyrektywy ustawiają zakresy.

Dzięki $watch dyrektywom można powiadamiać o zmianach dotyczących właściwości , co umożliwia dyrektywie renderowanie zaktualizowanej wartości do modelu DOM .

W związku z tym widok będzie zawsze powiadamiany, gdy właściwość w zakresie zostanie zmieniona, więc wyrażenie trójargumentowe zostanie automatycznie ocenione.

Answer 3

Oto przykład tego, czego szukasz, a tak zostanie wykonany na każdy strawienia

var app = angular.module('myApp', []); 
 
app.controller('MyController', ['$scope', MyController]); 
 
function MyController($scope) { 
 
\t $scope.isTrue = true; 
 
    setInterval(function() { 
 
     $scope.isTrue = !$scope.isTrue; 
 
     $scope.$digest(); 
 
    }, 1000); 
 
}

<script src="https://cdnjs.cloudflare.com/ajax/libs/angular.js/1.3.14/angular.min.js"></script> 
 
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/2.1.3/jquery.min.js"></script> 
 

 

 
<div ng-app="myApp" ng-controller='MyController'> 
 
    <div>{{isTrue ? "foo" : "bar"}}</div> 
 
</div>

Przeczytaj o Digest