AngularJS: Присвоить значение по умолчанию для связывания значения

Question

Я делаю панель с живым обновлением, поэтому после $ HTTP вызова, когда дб возвращает нулевой объект, который я хочу задать значение по умолчанию в качестве нулевого

$scope.SAP=0; 
 
$http({ 
 
\t \t \t method: 'GET', 
 
      url: 'getTilesDataForPrjectReport.do', 
 
\t \t }).then(function(response){ 
 
\t \t \t \t if(response.data.proj==='SAP'){ 
 
\t \t \t \t \t $scope.SAP=response.data; 
 
\t \t \t \t } 
 
\t \t \t } 
 
\t \t });

<div style="height:20%; background-color:#ff9e97;"> 
 
\t <p id="colorPalletDashboardTileRed"> {{SAP.red}}</p> 
 
\t <p id="colorPalletDashboardTileAmber">{{SAP.amber}}</p> 
 
\t <p id="colorPalletDashboardTileGreen">{{SAP.green}}</p> 
 
\t </div> 
 
\t <div style="height:18%; background-color:#ff8a81;"> 
 
\t <p> Total Projects : {{SAP.totalProj}} </p> 
 
\t </div>

Если SAP не отвечает на данные ответа, мне нужно отобразить 0 во всех привязках SAP, , даже если я назначаю от 0 до $ scope.SAP, это не отражается в html. Я знаю, что это может быть сделано с нг скрытие с другим <p> тегом, но что самое простое решение

Answer 1

<!-- language: lang-js --> 

    <div style="height:20%; background-color:#ff9e97;"> 
     <p id="colorPalletDashboardTileRed"> {{SAP.red || 0}}</p> 
     <p id="colorPalletDashboardTileAmber">{{SAP.amber || 0}}</p> 
     <p id="colorPalletDashboardTileGreen">{{SAP.green || 0}}</p> 
     </div> 
     <div style="height:18%; background-color:#ff8a81;"> 
     <p> Total Projects : {{SAP.totalProj || 0}} </p> 
     </div> 
    (or) 
//define $scope.default = 0; 
<div style="height:20%; background-color:#ff9e97;"> 
     <p id="colorPalletDashboardTileRed"> {{SAP.red || default}}</p> 
     <p id="colorPalletDashboardTileAmber">{{SAP.amber || default}}</p> 
     <p id="colorPalletDashboardTileGreen">{{SAP.green || default}}</p> 
     </div> 
     <div style="height:18%; background-color:#ff8a81;"> 
     <p> Total Projects : {{SAP.totalProj || default }} </p> 
     </div> 

<!-- end snippet --> 

I think, you can try this 
or 

Я думаю, вы можете попробовать это

Answer 2

Вместо назначения $scope.SAP = 0, вы можете назначить

$scope.SAP = {"red": 0, "amber": 0, "green": 0, "totalProj": 0} 

или любое значение по умолчанию.

Answer 3

Убедитесь, что ваш html должен находиться в контексте контроллера, где вы извлекаете данные и назначаете $scope.SAP.

Вы можете использовать цифровой фильтр, который также предоставит вам , форматирование.

{{SAP.red | number}} 

Sample Demo