Почему рендеринг элемента на html-странице происходит при нажатии кнопки inspect element на консоли разработчика?

Question

Я использую angularjs (1.x) в Cordova для создания приложения. Во время рендеринга данных из контроллера на HTML-страницу с использованием ng-init (при загрузке страницы) данные не отображаются в части просмотра HTML-страницы, только единственная пустая карта, скорее данные доступны в консоли .log часть а также в элементах. Данные просматриваются только при нажатии кнопки проверки элемента в консоли разработчика браузера.

Это происходит, когда я использую Cordova с angularjs и HTML5.

$scope.visitingCardDetails = response.data;
$scope.cardData = {}; //Rendered Card Data 
$scope.templateData = response.data[field]._templateId;
$scope.data = $interpolate($scope.templateData.template)($scope);
$scope.template_data = $sce.trustAsHtml($scope.data); 

<ons-row ng-repeat="vcdata in acceptedCardDetails" 
    ng-if="cardHolderLength != 0">
    <ons-col>
        <ons-card>
            <div ng-bind-html="template_data"></div>
            <div class="right-align margin-top-5">
                 <button class="btn btn-sm btn-danger" ng- 
                  click="deleteVisitingCard(vcdata._i)"></i> 
                  </button>
             </div>
         </ons-card>
    </ons-col>
</ons-row>

В нем должна отображаться часть ng-bind-html (template_data) при нажатии на маршрут, но на самом деле это происходит при обновлении страницы, а также когда я нажимаю кнопку проверки элемента.