运行AngularJS / nodejs项目时Bootstrap <div>错误

时间:2017-08-22 20:07:56

标签: html angularjs node.js bootstrap-4

当我运行项目以查看登录/注册屏幕时,它会显示此屏幕

登录/注册:

login / register

在我的代码中我有Bootstrap,jQuery已经声明了

 <script type="text/javascript" src="assets/js/jquery.min.js"></script>
 <link rel="stylesheet" type="text/css" href="assets/bootstrap/css/bootstrap.min.css">
 <script type="text/javascript" src="assets/bootstrap/js/bootstrap.min.js"></script>  
 <link rel="stylesheet" href="assets/css/styles.css">

我在这样的div中有登录/注册

<div class="col-lg-12" *ngIf="!identity">
  <div class="col-lg-6">
      <h1>Identificate</h1>
        <form class="col-md-10">
          <p>
              <label>Correo electrónico:</label>
                <input type="text" class="form-control" required/>
            </p>
            <p>
              <label>Correo electrónico:</label>
                <input type="text" class="form-control" required/>
            </p>

            <input type="submit" value="Entrar" class="btn btn-primary"/>
        </form>
    </div>
    <div class="col-lg-6">
      <h1>Registrate</h1>
    </div>
</div>

我想在屏幕上看到左边的&#34; Ingresa&#34;并且正确&#34;注册&#34;

在Chrome命令行中,我看到此错误:

  

未捕获错误:Bootstrap下拉列表需要Popper.js
  (https://popper.js.org
      在bootstrap.min.js:6
      在bootstrap.min.js:6
      在bootstrap.min.js:6

1 个答案:

答案 0 :(得分:0)

尝试将整个块(来自<div class="col-lg-12" *ngIf="!identity">包装在

中)

<div class="container-fluid" id="someContainer">

此外,您需要阅读引导程序开始更好一点 - https://getbootstrap.com/docs/4.0/getting-started/introduction/#quick-start

它说你需要加载popper js。

    <script type="text/javascript" src="assets/js/jquery.min.js"></script>
<!-- load popper before BS ---> 
             <script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.11.0/umd/popper.min.js" integrity="sha384-b/U6ypiBEHpOf/4+1nzFpr53nxSS+GLCkfwBdFNTxtclqqenISfwAzpKaMNFNmj4" crossorigin="anonymous"></script>
    <!-- now load Bootstrap -->
             <link rel="stylesheet" type="text/css" href="assets/bootstrap/css/bootstrap.min.css">
             <script type="text/javascript" src="assets/bootstrap/js/bootstrap.min.js"></script>  
             <link rel="stylesheet" href="assets/css/styles.css">

看看是否有效......