AngularJS экранный объект в HTML

Question

Я сделал вызов API для получения некоторых данных. успешно. Это сумма часов в кредитах. Я получаю

Laravel SQL-запрос:

$result = DB::table('contracts')
    ->select(DB::raw('SUM(monthly_credits) as Total'))
    ->get();
    return $this->sendResponse($result->toArray(), 'credits retrieved succesfully');

Угловой вызов:

 monthlyCredits() {
return new Promise(resolve => {
  this.http.get(this.apiUrl+'/api/credits').subscribe(data => {
    resolve(data);},
    err => {
      console.log(err);
  });
});

}

home.ts:

  monthlyCredits(){
this.restProvider.monthlyCredits()
.then(data => {
this.credits = data['data'];
console.log(this.credits);
});

}

данные: [{всего: 50,5}] -> 0: {всего: 50,5}

Когда я отображаю его на фронте с {{credits | json }}

возвращает

[{ "всего": 50,5}]

Я пытаюсь отобразить только сумму общих кредитов, которая составляет 50,5. не другие символы.

Заранее спасибо.

Answer 1

Вы должны установить total на this.credits или использовать полный путь в своем HTML-шаблоне, например {{credits[0].total}}

попробуйте в вашем home.ts:

  monthlyCredits(){
this.restProvider.monthlyCredits()
.then(data => {
this.credits = data['data'][0]['total'];
console.log(this.credits);
});

Убедитесь, что вы получаете доступ к общему количеству, только если оно загружено.

Answer 2

Вам необходимо получить доступ к общей собственности из кредитов, измените ее следующим образом:

{{credits[0].total}}