如何避免在Angular中更新視圖之後舊值閃現？

以我的角度的應用，有具有一個事件監聽器的主要的應用程序組成：如何避免在Angular中更新視圖之後舊值閃現？

... 
$scope.$on('page::change', function(e, value) { 
    self.navList = value; 
}); 
...

和APP部件內的導航組件，它只有一個結合至navList應用組件內部varible：

app.component('navBar', { 
    bindings: { 
    list: '<', 
    }, 
    templateUrl: 'templates/e/navBar.html', 
    ... 
});

裏面navBar.html，我用NG-重複顯示 '名單' 的數據：每當我改變navList i的值

<nav> 
    <a ng-repeat="(key,value) in Nav.list" ng-href="{{ value }}" ng-bind="key"></a> 
</nav>

n面的應用程序，或者我發出「頁面::變化」的情況下，數據的視圖將在網頁上閃爍，如：

原文：

OldValue

再閃：

NewValue OldValue

Then finally：

NewValue

我應該如何解決這個問題？ anuglar的版本是1.5.8

來源

2016-12-27 qwang

你不想保留（舊的和新的）值 –

我有時同樣的問題，我的解決辦法是把一個單元周圍，以避免許多綁定到一個元素：

<nav> 
    <span ng-repeat="(key,value) in Nav.list"> 
     <a ng-href="{{value}}">{{key}}</a> 
    </span> 
</nav>

我不知道這是否可以幫助你在你的情況，但我可能是一個嘗試。

來源

2016-12-27 14:01:27 Sim

是的，它現在可以工作。非常感謝。 – qwang

你可以試試這個：

$scope.$watch('modelName' , function (newValue, oldValue) { 
    // access new and old value here 
    console.log("Your former modelName was "+oldValue+", your current modelName value "+newValue+"."); 
});

來源

2016-12-27 12:11:30

是的，我試試這個來測試它。它以正確的方式更新。但只有觀點直接改變。它應該像'oldValue' - >'newValue'一樣改變，在我看來它改變了'oldValue' - >'newValue oldValue' - >'newValue'。最終結果是正確的，但觀點閃現。 – qwang

對不起，我的意思是不直接改變。 – qwang

然後我會建議，雖然綁定值清除了以前的值：例如：$ scope.myName =「」; –

如何避免在Angular中更新視圖之後舊值閃現？

回答

相關問題