Angular Js Interpolate Error : [$interpolate:interr]

I Am Using Angular JS on the front end and Node JS as the backend. I am trying to hit an API and display data in the front end. The data includes some text, images, and 3d file paths ( files are fetched from AWS S3 ). The API is working and I am getting the data URL (https://isl-wishar-assets.s3.us-east-1.amazonaws.com/model/santa_1.glb) also but its not rendering. If I pass direct Url in src then it works as shown in the pic in section 2 but in Section 1 I am rendering 3d model which I am passing through API in expression but it's not displaying. My Controller code is attached.

Angularjs error link https://code.angularjs.org/1.7.8/docs/error/$interpolate/interr?p0=%7B%7Bar_model%7D%7D&p1=Error:%20%5B$sce:insecurl%5D%20http:%2F%2Ferrors.angularjs.org%2F1.7.8%2F$sce%2Finsecurl%3Fp0%3Dhttps%253A%252F%252Fisl-wishar-assets.s3.us-east-1.amazonaws.com%252Fmodel%252Fsanta_1.glb

Frontend

$scope.ardetails = function(ar_id, user_id) {
  $http
    .get(CONSTANT.baseUrl + "/apiRoute/ardetails/" + ar_id + "/" + user_id)
    .then(function(data) {
      console.log("User Details API");
      console.log(data);

      $scope.id = data.data.data[0]._id;
      $scope.ar_userName = data.data.data[0].userName;
      $scope.ar_email = data.data.data[0].email;
      $scope.ar_model = data.data.data[0].arModel;
    });
};

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/angular.js/1.7.8/angular.min.js"></script>
<script type="module" src="https://unpkg.com/@google/model-viewer/dist/model-viewer.min.js"></script>

<h1>Section 1</h1>

<model-viewer class="model-align" id="paused-change-demo" camera-controls autoplay animation-name="Running" ar ar-modes="scene-viewer quick-look fallback" shadow-intensity="1" src="" ios-src="" magic-leap alt="AR ISL">
</model-viewer>

<hr>

<h1>Section 2</h1>

<model-viewer class="model-align" id="paused-change-demo" camera-controls autoplay animation-name="Running" ar ar-modes="scene-viewer quick-look fallback" shadow-intensity="1" src="https://modelviewer.dev/shared-assets/models/Astronaut.glb" ios-src="https://modelviewer.dev/shared-assets/models/Astronaut.usdz"
  magic-leap alt="AR ISL">
</model-viewer>
<h1>arModel Url : </h1>

App.js File
var App= angular.module("App", ["ui.router"]);

I tried ngSanitize but it's not working. I am getting an Interpolation Error. I tried all possible ways to fix it but it's not working.

Error

Output