与ASP MVC集成时，mdb-icon在Angular中不起作用

Question

使用本文https://www.mithunvp.com/angular-asp-net-mvc-5-angular-cli-visual-studio-2017/，我已成功将MDB Angular Dashboard模板集成到ASP MVC应用程序中，但是现在的问题是Angular应用程序现在的mdb-icon标记不再起作用

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.12.9/umd/popper.min.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0/js/bootstrap.min.js"></script>
<link href="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0/css/bootstrap.min.css" rel="stylesheet"/>

<div id="header">
                 <div class="container">
                    <div class="row">
                      
                       <div class="col-lg-8 col-md-8">
                         <strong class="logo"><a href="#"></a></strong>
                       </div>
                         <nav class="nav-bar navbar-expand-md">
                       <div class="col-lg-4 col-md-4">
                             <div class="tools">
                                <div class="lang">
                                   <a href="#" data-toggle="dropdown" class="btn btn-default btn-select">English</a>
                                   <ul class="dropdown-menu " >
                                      <li class="dropdown-item"><a href="#">English</a>
                                      </li>
                                      <li class="dropdown-item"><a href="#">spanish</a>
                                      </li>
                                   </ul>
                                </div>
                                <!-- lang -->
                             </div>
                             <!-- tools -->
                       </div>

                               <ul id="main-nav" class="collapse navbar-collapse" id="navDrop">
                                 <li><a href="#">Home</a>
                                 </li>
                                 <li><a href="#">Page</a>
                                 </li>
                                 <li><a href="#">Page</a>
                                 </li>
                                 <li><a href="#">Page</a>
                                 </li>
                                 <li><a href="#">Page</a>
                                 </li>
                                 <li><a href="#">Page</a>
                                 </li>
                                 <li><a href="#">Page</a>
                                 </li>
                                 <li><a href="#">Page</a>
                                 </li>
                                </ul>
                          </nav>

                          <!-- nav-bar -->	<span class=" hamburger ml-auto mr-3 btn-menu d-block collapse navbar-collapse" data-target="#navDrop"><span>menu</span></span>
                       </div>
                    </div>
                 </div>

它应该显示pie char图标，但在这样的控制台中显示带有错误的空白框