title: Angular and Bootstrapstudio bootstrap/css/bootstrap.min.css) returned a Promise
body: <p>I recently developed a form in Bootstrap studio  that I would know like to use in my angular application. I generated a component to host the exported html code form bootstrap studio and I have placed it all into a components file. I now have a structure that looks something like this is my file directory.</p>
  <p><a href="https://i.stack.imgur.com/eSpps.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/eSpps.png" alt="enter image description here" /></a></p>
  <p>index.html, login.html, profile.html, register.html and table.html all all the html files generated by Bootstrap studio. I would like to use the profile HTML in my app so I copied that code into my user-profiles.component.html file so that it looks like this</p>
  <pre><code>&lt;!DOCTYPE html&gt;
  &lt;html&gt;
  
  &lt;head&gt;
      &lt;meta charset=&quot;utf-8&quot;&gt;
      &lt;meta name=&quot;viewport&quot; content=&quot;width=device-width, initial-scale=1.0, shrink-to-fit=no&quot;&gt;
      &lt;title&gt;Profile - Brand&lt;/title&gt;
      &lt;link rel=&quot;stylesheet&quot; href=&quot;./assets/bootstrap/css/bootstrap.min.css&quot;&gt;
      &lt;link rel=&quot;stylesheet&quot; href=&quot;https://fonts.googleapis.com/css?family=Nunito:200,200i,300,300i,400,400i,600,600i,700,700i,800,800i,900,900i&quot;&gt;
      &lt;link rel=&quot;stylesheet&quot; href=&quot;https://use.fontawesome.com/releases/v5.12.0/css/all.css&quot;&gt;
      &lt;link rel=&quot;stylesheet&quot; href=&quot;https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css&quot;&gt;
      &lt;link rel=&quot;stylesheet&quot; href=&quot;./assets/fonts/fontawesome5-overrides.min.css&quot;&gt;
  &lt;/head&gt;
  
  &lt;body id=&quot;page-top&quot;&gt;
      &lt;div id=&quot;wrapper&quot;&gt;
          &lt;nav class=&quot;navbar navbar-dark align-items-start sidebar sidebar-dark accordion bg-gradient-primary p-0&quot;&gt;
              &lt;div class=&quot;container-fluid d-flex flex-column p-0&quot;&gt;
                  &lt;a class=&quot;navbar-brand d-flex justify-content-center align-items-center sidebar-brand m-0&quot; href=&quot;#&quot;&gt;
                      &lt;div class=&quot;sidebar-brand-icon rotate-n-15&quot;&gt;&lt;i class=&quot;fas fa-laugh-wink&quot;&gt;&lt;/i&gt;&lt;/div&gt;
                      &lt;div class=&quot;sidebar-brand-text mx-3&quot;&gt;&lt;span&gt;Brand&lt;/span&gt;&lt;/div&gt;
                  &lt;/a&gt;
                  &lt;hr class=&quot;sidebar-divider my-0&quot;&gt;
                  &lt;ul class=&quot;nav navbar-nav text-light&quot; id=&quot;accordionSidebar&quot;&gt;
                      &lt;li class=&quot;nav-item&quot;&gt;&lt;a class=&quot;nav-link&quot; href=&quot;index.html&quot;&gt;&lt;i class=&quot;fas fa-tachometer-alt&quot;&gt;&lt;/i&gt;&lt;span&gt;Dashboard&lt;/span&gt;&lt;/a&gt;&lt;/li&gt;
                      &lt;li class=&quot;nav-item&quot;&gt;&lt;a class=&quot;nav-link active&quot; href=&quot;profile.html&quot;&gt;&lt;i class=&quot;fas fa-user&quot;&gt;&lt;/i&gt;&lt;span&gt;Profile&lt;/span&gt;&lt;/a&gt;&lt;/li&gt;
                      &lt;li class=&quot;nav-item&quot;&gt;&lt;a class=&quot;nav-link&quot; href=&quot;table.html&quot;&gt;&lt;i class=&quot;fas fa-table&quot;&gt;&lt;/i&gt;&lt;span&gt;Table&lt;/span&gt;&lt;/a&gt;&lt;/li&gt;
                      &lt;li class=&quot;nav-item&quot;&gt;&lt;a class=&quot;nav-link&quot; href=&quot;login.html&quot;&gt;&lt;i class=&quot;far fa-user-circle&quot;&gt;&lt;/i&gt;&lt;span&gt;Login&lt;/span&gt;&lt;/a&gt;&lt;/li&gt;
                      &lt;li class=&quot;nav-item&quot;&gt;&lt;a class=&quot;nav-link&quot; href=&quot;register.html&quot;&gt;&lt;i class=&quot;fas fa-user-circle&quot;&gt;&lt;/i&gt;&lt;span&gt;Register&lt;/span&gt;&lt;/a&gt;&lt;/li&gt;
                  &lt;/ul&gt;
                  &lt;div class=&quot;text-center d-none d-md-inline&quot;&gt;&lt;button class=&quot;btn rounded-circle border-0&quot; id=&quot;sidebarToggle&quot; type=&quot;button&quot;&gt;&lt;/button&gt;&lt;/div&gt;
              &lt;/div&gt;
          &lt;/nav&gt;
          &lt;div class=&quot;d-flex flex-column&quot; id=&quot;content-wrapper&quot;&gt;
              &lt;div id=&quot;content&quot;&gt;
                  &lt;nav class=&quot;navbar navbar-light navbar-expand bg-white shadow mb-4 topbar static-top&quot;&gt;
                      &lt;div class=&quot;container-fluid&quot;&gt;&lt;button class=&quot;btn btn-link d-md-none rounded-circle mr-3&quot; id=&quot;sidebarToggleTop&quot; type=&quot;button&quot;&gt;&lt;i class=&quot;fas fa-bars&quot;&gt;&lt;/i&gt;&lt;/button&gt;
                          &lt;form class=&quot;form-inline d-none d-sm-inline-block mr-auto ml-md-3 my-2 my-md-0 mw-100 navbar-search&quot;&gt;
                              &lt;div class=&quot;input-group&quot;&gt;&lt;input class=&quot;bg-light form-control border-0 small&quot; type=&quot;text&quot; placeholder=&quot;Search for ...&quot;&gt;
                                  &lt;div class=&quot;input-group-append&quot;&gt;&lt;button class=&quot;btn btn-primary py-0&quot; type=&quot;button&quot;&gt;&lt;i class=&quot;fas fa-search&quot;&gt;&lt;/i&gt;&lt;/button&gt;&lt;/div&gt;
                              &lt;/div&gt;
                          &lt;/form&gt;
                          &lt;ul class=&quot;nav navbar-nav flex-nowrap ml-auto&quot;&gt;
                              &lt;li class=&quot;nav-item dropdown d-sm-none no-arrow&quot;&gt;&lt;a class=&quot;dropdown-toggle nav-link&quot; data-toggle=&quot;dropdown&quot; aria-expanded=&quot;false&quot; href=&quot;#&quot;&gt;&lt;i class=&quot;fas fa-search&quot;&gt;&lt;/i&gt;&lt;/a&gt;
                                  &lt;div class=&quot;dropdown-menu dropdown-menu-right p-3 animated--grow-in&quot; aria-labelledby=&quot;searchDropdown&quot;&gt;
                                      &lt;form class=&quot;form-inline mr-auto navbar-search w-100&quot;&gt;
                                          &lt;div class=&quot;input-group&quot;&gt;&lt;input class=&quot;bg-light form-control border-0 small&quot; type=&quot;text&quot; placeholder=&quot;Search for ...&quot;&gt;
                                              &lt;div class=&quot;input-group-append&quot;&gt;&lt;button class=&quot;btn btn-primary py-0&quot; type=&quot;button&quot;&gt;&lt;i class=&quot;fas fa-search&quot;&gt;&lt;/i&gt;&lt;/button&gt;&lt;/div&gt;
                                          &lt;/div&gt;
                                      &lt;/form&gt;
                                  &lt;/div&gt;
                              &lt;/li&gt;
                              &lt;li class=&quot;nav-item dropdown no-arrow mx-1&quot;&gt;
                                  &lt;div class=&quot;nav-item dropdown no-arrow&quot;&gt;&lt;a class=&quot;dropdown-toggle nav-link&quot; data-toggle=&quot;dropdown&quot; aria-expanded=&quot;false&quot; href=&quot;#&quot;&gt;&lt;span class=&quot;badge badge-danger badge-counter&quot;&gt;3+&lt;/span&gt;&lt;i class=&quot;fas fa-bell fa-fw&quot;&gt;&lt;/i&gt;&lt;/a&gt;
                                      &lt;div class=&quot;dropdown-menu dropdown-menu-right dropdown-list dropdown-menu-right animated--grow-in&quot;&gt;
                                          &lt;h6 class=&quot;dropdown-header&quot;&gt;alerts center&lt;/h6&gt;
                                          &lt;a class=&quot;d-flex align-items-center dropdown-item&quot; href=&quot;#&quot;&gt;
                                              &lt;div class=&quot;mr-3&quot;&gt;
                                                  &lt;div class=&quot;bg-primary icon-circle&quot;&gt;&lt;i class=&quot;fas fa-file-alt text-white&quot;&gt;&lt;/i&gt;&lt;/div&gt;
                                              &lt;/div&gt;
                                              &lt;div&gt;&lt;span class=&quot;small text-gray-500&quot;&gt;December 12, 2019&lt;/span&gt;
                                                  &lt;p&gt;A new monthly report is ready to download!&lt;/p&gt;
                                              &lt;/div&gt;
                                          &lt;/a&gt;
                                          &lt;a class=&quot;d-flex align-items-center dropdown-item&quot; href=&quot;#&quot;&gt;
                                              &lt;div class=&quot;mr-3&quot;&gt;
                                                  &lt;div class=&quot;bg-success icon-circle&quot;&gt;&lt;i class=&quot;fas fa-donate text-white&quot;&gt;&lt;/i&gt;&lt;/div&gt;
                                              &lt;/div&gt;
                                              &lt;div&gt;&lt;span class=&quot;small text-gray-500&quot;&gt;December 7, 2019&lt;/span&gt;
                                                  &lt;p&gt;$290.29 has been deposited into your account!&lt;/p&gt;
                                              &lt;/div&gt;
                                          &lt;/a&gt;
                                          &lt;a class=&quot;d-flex align-items-center dropdown-item&quot; href=&quot;#&quot;&gt;
                                              &lt;div class=&quot;mr-3&quot;&gt;
                                                  &lt;div class=&quot;bg-warning icon-circle&quot;&gt;&lt;i class=&quot;fas fa-exclamation-triangle text-white&quot;&gt;&lt;/i&gt;&lt;/div&gt;
                                              &lt;/div&gt;
                                              &lt;div&gt;&lt;span class=&quot;small text-gray-500&quot;&gt;December 2, 2019&lt;/span&gt;
                                                  &lt;p&gt;Spending Alert: We've noticed unusually high spending for your account.&lt;/p&gt;
                                              &lt;/div&gt;
                                          &lt;/a&gt;&lt;a class=&quot;text-center dropdown-item small text-gray-500&quot; href=&quot;#&quot;&gt;Show All Alerts&lt;/a&gt;&lt;/div&gt;
                                  &lt;/div&gt;
                              &lt;/li&gt;
                              &lt;li class=&quot;nav-item dropdown no-arrow mx-1&quot;&gt;
                                  &lt;div class=&quot;nav-item dropdown no-arrow&quot;&gt;&lt;a class=&quot;dropdown-toggle nav-link&quot; data-toggle=&quot;dropdown&quot; aria-expanded=&quot;false&quot; href=&quot;#&quot;&gt;&lt;i class=&quot;fas fa-envelope fa-fw&quot;&gt;&lt;/i&gt;&lt;span class=&quot;badge badge-danger badge-counter&quot;&gt;7&lt;/span&gt;&lt;/a&gt;
                                      &lt;div class=&quot;dropdown-menu dropdown-menu-right dropdown-list dropdown-menu-right animated--grow-in&quot;&gt;
                                          &lt;h6 class=&quot;dropdown-header&quot;&gt;alerts center&lt;/h6&gt;
                                          &lt;a class=&quot;d-flex align-items-center dropdown-item&quot; href=&quot;#&quot;&gt;
                                              &lt;div class=&quot;dropdown-list-image mr-3&quot;&gt;&lt;img class=&quot;rounded-circle&quot; src=&quot;./assets/img/avatars/avatar4.jpeg&quot;&gt;
                                                  &lt;div class=&quot;bg-success status-indicator&quot;&gt;&lt;/div&gt;
                                              &lt;/div&gt;
                                              &lt;div class=&quot;font-weight-bold&quot;&gt;
                                                  &lt;div class=&quot;text-truncate&quot;&gt;&lt;span&gt;Hi there! I am wondering if you can help me with a problem I've been having.&lt;/span&gt;&lt;/div&gt;
                                                  &lt;p class=&quot;small text-gray-500 mb-0&quot;&gt;Emily Fowler - 58m&lt;/p&gt;
                                              &lt;/div&gt;
                                          &lt;/a&gt;
                                          &lt;a class=&quot;d-flex align-items-center dropdown-item&quot; href=&quot;#&quot;&gt;
                                              &lt;div class=&quot;dropdown-list-image mr-3&quot;&gt;&lt;img class=&quot;rounded-circle&quot; src=&quot;./assets/img/avatars/avatar2.jpeg&quot;&gt;
                                                  &lt;div class=&quot;status-indicator&quot;&gt;&lt;/div&gt;
                                              &lt;/div&gt;
                                              &lt;div class=&quot;font-weight-bold&quot;&gt;
                                                  &lt;div class=&quot;text-truncate&quot;&gt;&lt;span&gt;I have the photos that you ordered last month!&lt;/span&gt;&lt;/div&gt;
                                                  &lt;p class=&quot;small text-gray-500 mb-0&quot;&gt;Jae Chun - 1d&lt;/p&gt;
                                              &lt;/div&gt;
                                          &lt;/a&gt;
                                          &lt;a class=&quot;d-flex align-items-center dropdown-item&quot; href=&quot;#&quot;&gt;
                                              &lt;div class=&quot;dropdown-list-image mr-3&quot;&gt;&lt;img class=&quot;rounded-circle&quot; src=&quot;./assets/img/avatars/avatar3.jpeg&quot;&gt;
                                                  &lt;div class=&quot;bg-warning status-indicator&quot;&gt;&lt;/div&gt;
                                              &lt;/div&gt;
                                              &lt;div class=&quot;font-weight-bold&quot;&gt;
                                                  &lt;div class=&quot;text-truncate&quot;&gt;&lt;span&gt;Last month's report looks great, I am very happy with the progress so far, keep up the good work!&lt;/span&gt;&lt;/div&gt;
                                                  &lt;p class=&quot;small text-gray-500 mb-0&quot;&gt;Morgan Alvarez - 2d&lt;/p&gt;
                                              &lt;/div&gt;
                                          &lt;/a&gt;
                                          &lt;a class=&quot;d-flex align-items-center dropdown-item&quot; href=&quot;#&quot;&gt;
                                              &lt;div class=&quot;dropdown-list-image mr-3&quot;&gt;&lt;img class=&quot;rounded-circle&quot; src=&quot;./assets/img/avatars/avatar5.jpeg&quot;&gt;
                                                  &lt;div class=&quot;bg-success status-indicator&quot;&gt;&lt;/div&gt;
                                              &lt;/div&gt;
                                              &lt;div class=&quot;font-weight-bold&quot;&gt;
                                                  &lt;div class=&quot;text-truncate&quot;&gt;&lt;span&gt;Am I a good boy? The reason I ask is because someone told me that people say this to all dogs, even if they aren't good...&lt;/span&gt;&lt;/div&gt;
                                                  &lt;p class=&quot;small text-gray-500 mb-0&quot;&gt;Chicken the Dog · 2w&lt;/p&gt;
                                              &lt;/div&gt;
                                          &lt;/a&gt;&lt;a class=&quot;text-center dropdown-item small text-gray-500&quot; href=&quot;#&quot;&gt;Show All Alerts&lt;/a&gt;&lt;/div&gt;
                                  &lt;/div&gt;
                                  &lt;div class=&quot;shadow dropdown-list dropdown-menu dropdown-menu-right&quot; aria-labelledby=&quot;alertsDropdown&quot;&gt;&lt;/div&gt;
                              &lt;/li&gt;
                              &lt;div class=&quot;d-none d-sm-block topbar-divider&quot;&gt;&lt;/div&gt;
                              &lt;li class=&quot;nav-item dropdown no-arrow&quot;&gt;
                                  &lt;div class=&quot;nav-item dropdown no-arrow&quot;&gt;&lt;a class=&quot;dropdown-toggle nav-link&quot; data-toggle=&quot;dropdown&quot; aria-expanded=&quot;false&quot; href=&quot;#&quot;&gt;&lt;span class=&quot;d-none d-lg-inline mr-2 text-gray-600 small&quot;&gt;Valerie Luna&lt;/span&gt;&lt;img class=&quot;border rounded-circle img-profile&quot; src=&quot;./assets/img/avatars/avatar1.jpeg&quot;&gt;&lt;/a&gt;
                                      &lt;div
                                          class=&quot;dropdown-menu shadow dropdown-menu-right animated--grow-in&quot;&gt;&lt;a class=&quot;dropdown-item&quot; href=&quot;#&quot;&gt;&lt;i class=&quot;fas fa-user fa-sm fa-fw mr-2 text-gray-400&quot;&gt;&lt;/i&gt;&amp;nbsp;Profile&lt;/a&gt;&lt;a class=&quot;dropdown-item&quot; href=&quot;#&quot;&gt;&lt;i class=&quot;fas fa-cogs fa-sm fa-fw mr-2 text-gray-400&quot;&gt;&lt;/i&gt;&amp;nbsp;Settings&lt;/a&gt;
                                          &lt;a
                                              class=&quot;dropdown-item&quot; href=&quot;#&quot;&gt;&lt;i class=&quot;fas fa-list fa-sm fa-fw mr-2 text-gray-400&quot;&gt;&lt;/i&gt;&amp;nbsp;Activity log&lt;/a&gt;
                                              &lt;div class=&quot;dropdown-divider&quot;&gt;&lt;/div&gt;&lt;a class=&quot;dropdown-item&quot; href=&quot;#&quot;&gt;&lt;i class=&quot;fas fa-sign-out-alt fa-sm fa-fw mr-2 text-gray-400&quot;&gt;&lt;/i&gt;&amp;nbsp;Logout&lt;/a&gt;&lt;/div&gt;
                      &lt;/div&gt;
                      &lt;/li&gt;
                      &lt;/ul&gt;
              &lt;/div&gt;
              &lt;/nav&gt;
              &lt;div class=&quot;container-fluid&quot;&gt;
                  &lt;h3 class=&quot;text-dark mb-4&quot;&gt;Profile&lt;/h3&gt;
                  &lt;div class=&quot;row mb-3&quot;&gt;
                      &lt;div class=&quot;col-lg-4&quot;&gt;
                          &lt;div class=&quot;card mb-3&quot;&gt;
                              &lt;div class=&quot;card-body text-center shadow&quot;&gt;&lt;img class=&quot;rounded-circle mb-3 mt-4&quot; src=&quot;./assets/img/dogs/image2.jpeg&quot; width=&quot;160&quot; height=&quot;160&quot;&gt;
                                  &lt;div class=&quot;mb-3&quot;&gt;&lt;button class=&quot;btn btn-primary btn-sm&quot; type=&quot;button&quot;&gt;Change Photo&lt;/button&gt;&lt;/div&gt;
                              &lt;/div&gt;
                          &lt;/div&gt;
                          &lt;div class=&quot;card shadow mb-4&quot;&gt;
                              &lt;div class=&quot;card-header py-3&quot;&gt;
                                  &lt;h6 class=&quot;text-primary font-weight-bold m-0&quot;&gt;Projects&lt;/h6&gt;
                              &lt;/div&gt;
                              &lt;div class=&quot;card-body&quot;&gt;
                                  &lt;h4 class=&quot;small font-weight-bold&quot;&gt;Server migration&lt;span class=&quot;float-right&quot;&gt;20%&lt;/span&gt;&lt;/h4&gt;
                                  &lt;div class=&quot;progress progress-sm mb-3&quot;&gt;
                                      &lt;div class=&quot;progress-bar bg-danger&quot; aria-valuenow=&quot;20&quot; aria-valuemin=&quot;0&quot; aria-valuemax=&quot;100&quot; style=&quot;width: 20%;&quot;&gt;&lt;span class=&quot;sr-only&quot;&gt;20%&lt;/span&gt;&lt;/div&gt;
                                  &lt;/div&gt;
                                  &lt;h4 class=&quot;small font-weight-bold&quot;&gt;Sales tracking&lt;span class=&quot;float-right&quot;&gt;40%&lt;/span&gt;&lt;/h4&gt;
                                  &lt;div class=&quot;progress progress-sm mb-3&quot;&gt;
                                      &lt;div class=&quot;progress-bar bg-warning&quot; aria-valuenow=&quot;40&quot; aria-valuemin=&quot;0&quot; aria-valuemax=&quot;100&quot; style=&quot;width: 40%;&quot;&gt;&lt;span class=&quot;sr-only&quot;&gt;40%&lt;/span&gt;&lt;/div&gt;
                                  &lt;/div&gt;
                                  &lt;h4 class=&quot;small font-weight-bold&quot;&gt;Customer Database&lt;span class=&quot;float-right&quot;&gt;60%&lt;/span&gt;&lt;/h4&gt;
                                  &lt;div class=&quot;progress progress-sm mb-3&quot;&gt;
                                      &lt;div class=&quot;progress-bar bg-primary&quot; aria-valuenow=&quot;60&quot; aria-valuemin=&quot;0&quot; aria-valuemax=&quot;100&quot; style=&quot;width: 60%;&quot;&gt;&lt;span class=&quot;sr-only&quot;&gt;60%&lt;/span&gt;&lt;/div&gt;
                                  &lt;/div&gt;
                                  &lt;h4 class=&quot;small font-weight-bold&quot;&gt;Payout Details&lt;span class=&quot;float-right&quot;&gt;80%&lt;/span&gt;&lt;/h4&gt;
                                  &lt;div class=&quot;progress progress-sm mb-3&quot;&gt;
                                      &lt;div class=&quot;progress-bar bg-info&quot; aria-valuenow=&quot;80&quot; aria-valuemin=&quot;0&quot; aria-valuemax=&quot;100&quot; style=&quot;width: 80%;&quot;&gt;&lt;span class=&quot;sr-only&quot;&gt;80%&lt;/span&gt;&lt;/div&gt;
                                  &lt;/div&gt;
                                  &lt;h4 class=&quot;small font-weight-bold&quot;&gt;Account setup&lt;span class=&quot;float-right&quot;&gt;Complete!&lt;/span&gt;&lt;/h4&gt;
                                  &lt;div class=&quot;progress progress-sm mb-3&quot;&gt;
                                      &lt;div class=&quot;progress-bar bg-success&quot; aria-valuenow=&quot;100&quot; aria-valuemin=&quot;0&quot; aria-valuemax=&quot;100&quot; style=&quot;width: 100%;&quot;&gt;&lt;span class=&quot;sr-only&quot;&gt;100%&lt;/span&gt;&lt;/div&gt;
                                  &lt;/div&gt;
                              &lt;/div&gt;
                          &lt;/div&gt;
                      &lt;/div&gt;
                      &lt;div class=&quot;col-lg-8&quot;&gt;
                          &lt;div class=&quot;row mb-3 d-none&quot;&gt;
                              &lt;div class=&quot;col&quot;&gt;
                                  &lt;div class=&quot;card text-white bg-primary shadow&quot;&gt;
                                      &lt;div class=&quot;card-body&quot;&gt;
                                          &lt;div class=&quot;row mb-2&quot;&gt;
                                              &lt;div class=&quot;col&quot;&gt;
                                                  &lt;p class=&quot;m-0&quot;&gt;Peformance&lt;/p&gt;
                                                  &lt;p class=&quot;m-0&quot;&gt;&lt;strong&gt;65.2%&lt;/strong&gt;&lt;/p&gt;
                                              &lt;/div&gt;
                                              &lt;div class=&quot;col-auto&quot;&gt;&lt;i class=&quot;fas fa-rocket fa-2x&quot;&gt;&lt;/i&gt;&lt;/div&gt;
                                          &lt;/div&gt;
                                          &lt;p class=&quot;text-white-50 small m-0&quot;&gt;&lt;i class=&quot;fas fa-arrow-up&quot;&gt;&lt;/i&gt;&amp;nbsp;5% since last month&lt;/p&gt;
                                      &lt;/div&gt;
                                  &lt;/div&gt;
                              &lt;/div&gt;
                              &lt;div class=&quot;col&quot;&gt;
                                  &lt;div class=&quot;card text-white bg-success shadow&quot;&gt;
                                      &lt;div class=&quot;card-body&quot;&gt;
                                          &lt;div class=&quot;row mb-2&quot;&gt;
                                              &lt;div class=&quot;col&quot;&gt;
                                                  &lt;p class=&quot;m-0&quot;&gt;Peformance&lt;/p&gt;
                                                  &lt;p class=&quot;m-0&quot;&gt;&lt;strong&gt;65.2%&lt;/strong&gt;&lt;/p&gt;
                                              &lt;/div&gt;
                                              &lt;div class=&quot;col-auto&quot;&gt;&lt;i class=&quot;fas fa-rocket fa-2x&quot;&gt;&lt;/i&gt;&lt;/div&gt;
                                          &lt;/div&gt;
                                          &lt;p class=&quot;text-white-50 small m-0&quot;&gt;&lt;i class=&quot;fas fa-arrow-up&quot;&gt;&lt;/i&gt;&amp;nbsp;5% since last month&lt;/p&gt;
                                      &lt;/div&gt;
                                  &lt;/div&gt;
                              &lt;/div&gt;
                          &lt;/div&gt;
                          &lt;div class=&quot;row&quot;&gt;
                              &lt;div class=&quot;col&quot;&gt;
                                  &lt;div class=&quot;card shadow mb-3&quot;&gt;
                                      &lt;div class=&quot;card-header py-3&quot;&gt;
                                          &lt;p class=&quot;text-primary m-0 font-weight-bold&quot;&gt;User Settings&lt;/p&gt;
                                      &lt;/div&gt;
                                      &lt;div class=&quot;card-body&quot;&gt;
                                          &lt;form&gt;
                                              &lt;div class=&quot;form-row&quot;&gt;
                                                  &lt;div class=&quot;col&quot;&gt;
                                                      &lt;div class=&quot;form-group&quot;&gt;&lt;label for=&quot;username&quot;&gt;&lt;strong&gt;Username&lt;/strong&gt;&lt;/label&gt;&lt;input class=&quot;form-control&quot; type=&quot;text&quot; placeholder=&quot;user.name&quot; name=&quot;username&quot;&gt;&lt;/div&gt;
                                                  &lt;/div&gt;
                                                  &lt;div class=&quot;col&quot;&gt;
                                                      &lt;div class=&quot;form-group&quot;&gt;&lt;label for=&quot;email&quot;&gt;&lt;strong&gt;Email Address&lt;/strong&gt;&lt;/label&gt;&lt;input class=&quot;form-control&quot; type=&quot;email&quot; placeholder=&quot;user@example.com&quot; name=&quot;email&quot;&gt;&lt;/div&gt;
                                                  &lt;/div&gt;
                                              &lt;/div&gt;
                                              &lt;div class=&quot;form-row&quot;&gt;
                                                  &lt;div class=&quot;col&quot;&gt;
                                                      &lt;div class=&quot;form-group&quot;&gt;&lt;label for=&quot;first_name&quot;&gt;&lt;strong&gt;First Name&lt;/strong&gt;&lt;/label&gt;&lt;input class=&quot;form-control&quot; type=&quot;text&quot; placeholder=&quot;John&quot; name=&quot;first_name&quot;&gt;&lt;/div&gt;
                                                  &lt;/div&gt;
                                                  &lt;div class=&quot;col&quot;&gt;
                                                      &lt;div class=&quot;form-group&quot;&gt;&lt;label for=&quot;last_name&quot;&gt;&lt;strong&gt;Last Name&lt;/strong&gt;&lt;/label&gt;&lt;input class=&quot;form-control&quot; type=&quot;text&quot; placeholder=&quot;Doe&quot; name=&quot;last_name&quot;&gt;&lt;/div&gt;
                                                  &lt;/div&gt;
                                              &lt;/div&gt;
                                              &lt;div class=&quot;form-group&quot;&gt;&lt;button class=&quot;btn btn-primary btn-sm&quot; type=&quot;submit&quot;&gt;Save Settings&lt;/button&gt;&lt;/div&gt;
                                          &lt;/form&gt;
                                      &lt;/div&gt;
                                  &lt;/div&gt;
                                  &lt;div class=&quot;card shadow&quot;&gt;
                                      &lt;div class=&quot;card-header py-3&quot;&gt;
                                          &lt;p class=&quot;text-primary m-0 font-weight-bold&quot;&gt;Contact Settings&lt;/p&gt;
                                      &lt;/div&gt;
                                      &lt;div class=&quot;card-body&quot;&gt;
                                          &lt;form&gt;
                                              &lt;div class=&quot;form-group&quot;&gt;&lt;label for=&quot;address&quot;&gt;&lt;strong&gt;Address&lt;/strong&gt;&lt;/label&gt;&lt;input class=&quot;form-control&quot; type=&quot;text&quot; placeholder=&quot;Sunset Blvd, 38&quot; name=&quot;address&quot;&gt;&lt;/div&gt;
                                              &lt;div class=&quot;form-row&quot;&gt;
                                                  &lt;div class=&quot;col&quot;&gt;
                                                      &lt;div class=&quot;form-group&quot;&gt;&lt;label for=&quot;city&quot;&gt;&lt;strong&gt;City&lt;/strong&gt;&lt;/label&gt;&lt;input class=&quot;form-control&quot; type=&quot;text&quot; placeholder=&quot;Los Angeles&quot; name=&quot;city&quot;&gt;&lt;/div&gt;
                                                  &lt;/div&gt;
                                                  &lt;div class=&quot;col&quot;&gt;
                                                      &lt;div class=&quot;form-group&quot;&gt;&lt;label for=&quot;country&quot;&gt;&lt;strong&gt;Country&lt;/strong&gt;&lt;/label&gt;&lt;input class=&quot;form-control&quot; type=&quot;text&quot; placeholder=&quot;USA&quot; name=&quot;country&quot;&gt;&lt;/div&gt;
                                                  &lt;/div&gt;
                                              &lt;/div&gt;
                                              &lt;div class=&quot;form-group&quot;&gt;&lt;button class=&quot;btn btn-primary btn-sm&quot; type=&quot;submit&quot;&gt;Save&amp;nbsp;Settings&lt;/button&gt;&lt;/div&gt;
                                          &lt;/form&gt;
                                      &lt;/div&gt;
                                  &lt;/div&gt;
                              &lt;/div&gt;
                          &lt;/div&gt;
                      &lt;/div&gt;
                  &lt;/div&gt;
                  &lt;div class=&quot;card shadow mb-5&quot;&gt;
                      &lt;div class=&quot;card-header py-3&quot;&gt;
                          &lt;p class=&quot;text-primary m-0 font-weight-bold&quot;&gt;Forum Settings&lt;/p&gt;
                      &lt;/div&gt;
                      &lt;div class=&quot;card-body&quot;&gt;
                          &lt;div class=&quot;row&quot;&gt;
                              &lt;div class=&quot;col-md-6&quot;&gt;
                                  &lt;form&gt;
                                      &lt;div class=&quot;form-group&quot;&gt;&lt;label for=&quot;signature&quot;&gt;&lt;strong&gt;Signature&lt;/strong&gt;&lt;br&gt;&lt;/label&gt;&lt;textarea class=&quot;form-control&quot; rows=&quot;4&quot; name=&quot;signature&quot;&gt;&lt;/textarea&gt;&lt;/div&gt;
                                      &lt;div class=&quot;form-group&quot;&gt;
                                          &lt;div class=&quot;custom-control custom-switch&quot;&gt;&lt;input class=&quot;custom-control-input&quot; type=&quot;checkbox&quot; id=&quot;formCheck-1&quot;&gt;&lt;label class=&quot;custom-control-label&quot; for=&quot;formCheck-1&quot;&gt;&lt;strong&gt;Notify me about new replies&lt;/strong&gt;&lt;/label&gt;&lt;/div&gt;
                                      &lt;/div&gt;
                                      &lt;div class=&quot;form-group&quot;&gt;&lt;button class=&quot;btn btn-primary btn-sm&quot; type=&quot;submit&quot;&gt;Save Settings&lt;/button&gt;&lt;/div&gt;
                                  &lt;/form&gt;
                              &lt;/div&gt;
                          &lt;/div&gt;
                      &lt;/div&gt;
                  &lt;/div&gt;
              &lt;/div&gt;
          &lt;/div&gt;
          &lt;footer class=&quot;bg-white sticky-footer&quot;&gt;
              &lt;div class=&quot;container my-auto&quot;&gt;
                  &lt;div class=&quot;text-center my-auto copyright&quot;&gt;&lt;span&gt;Copyright © Brand 2020&lt;/span&gt;&lt;/div&gt;
              &lt;/div&gt;
          &lt;/footer&gt;
      &lt;/div&gt;&lt;a class=&quot;border rounded d-inline scroll-to-top&quot; href=&quot;#page-top&quot;&gt;&lt;i class=&quot;fas fa-angle-up&quot;&gt;&lt;/i&gt;&lt;/a&gt;&lt;/div&gt;
      &lt;script src=&quot;https://cdnjs.cloudflare.com/ajax/libs/jquery/3.5.1/jquery.min.js&quot;&gt;&lt;/script&gt;
      &lt;script src=&quot;https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/4.5.2/js/bootstrap.bundle.min.js&quot;&gt;&lt;/script&gt;
      &lt;script src=&quot;https://cdnjs.cloudflare.com/ajax/libs/Chart.js/2.8.0/Chart.bundle.min.js&quot;&gt;&lt;/script&gt;
      &lt;script src=&quot;./assets/js/bs-init.js&quot;&gt;&lt;/script&gt;
      &lt;script src=&quot;https://cdnjs.cloudflare.com/ajax/libs/jquery-easing/1.4.1/jquery.easing.js&quot;&gt;&lt;/script&gt;
      &lt;script src=&quot;./assets/js/theme.js&quot;&gt;&lt;/script&gt;
  &lt;/body&gt;
  
  &lt;/html&gt;
  </code></pre>
  <p>and my user-profiles.component.ts file looks like this</p>
  <pre><code>import { Component, OnInit } from '@angular/core';
  
  @Component({
    selector: 'app-user-profiles',
    templateUrl: './user-profiles.component.html',
    styleUrls: ['./user-profiles.component.scss']
  })
  export class UserProfilesComponent implements OnInit {
  
    constructor() { }
  
    ngOnInit(): void {
    }
  
  }
  </code></pre>
  <p>so I believe that this should still work but I am getting the following error</p>
  <pre><code>ERROR in HostResourceLoader: loader(C:/Users/ipadc/Dropbox/References.Data/NWU werk/Projekvak/Code/Final-honors-app/src/app/components/user-profiles/assets/bootstrap/css/bootstrap.min.css) returned a Promise
    
  </code></pre>
  <p>I have no idea what this error means or how to resolve it any tips would be much appreciated</p>