Angular JS：自定義指令問題（指令如果延遲從api接收數據時工作不正常）

Question

以下是我編寫的一個自定義指令，用於將數值格式化爲具有適當標點的貨幣，並將十進制值。

var directiveapps = angular.module('myApp.roundedValue', []); 
    directiveapps.directive('roundedValue', function() { 
    return{ 
    scope: { 
     data: '=items' 
    }, 
    template: '<div>$ {{value|number}}</div>', 
    link: function(scope){ 
     scope.value = Math.round(scope.data* 100)/100; 
    } 
    }; 
}); 

該指令調用如下，

<div class="overallsummary_meter_txt left"> 
Total Price<br> 
<span rounded-value items="totalPrice" class="orange_txt"></span> 
</div> 

我現在面臨的問題是，我得到一個null值，如果它需要更多的時間來得到API數值。

我怎樣才能保持指令無法執行，直到我們瞭解從API值的變量項目

我一直在使用scope.$watch和超時服務嘗試，但結果並不令人滿意。

我該如何解決這個問題？

Answer 1

嘗試加入NG-IF = {API數據到達}語句指令，所以角只有當數據是可用的將附加自定義指令模板..

<div ng-if={IsDataAvailable} class="overallsummary_meter_txt left"> 
Total Price<br> 
<span rounded-value items="totalPrice" class="orange_txt"></span> 
</div>