简体   繁体   English

将Bootstrap和jQuery添加到Angular 8

[英]Add bootstrap and jQuery to Angular 8

I'm new to Angular. 我是Angular的新手。 I'm trying to add bootstrap and jquery to my first project. 我正在尝试将Bootstrap和Jquery添加到我的第一个项目中。 I run this code on my project dir npm install bootstrap@3 jquery --save 我在我的项目目录npm install bootstrap@3 jquery --save上运行此代码

It was run perfectly and added jquery and bootstrap to node_modules folder. 它运行完美,并且将jquery和bootstrap添加到了node_modules文件夹中。 And these lines can see under the dependencies in package.json 这些行可以在package.json中的dependencies下看到

 "bootstrap": "^3.4.1",
 "jquery": "^3.4.1",

Then parts were added to the styles and scripts in the angular.json file. 然后将零件添加到angular.json文件中的stylesscripts中。

    "styles": [
          "node_modules/bootstrap/dist/css/bootstrap.min.css"
       ],
       "scripts": [
           "node_modules/jquery/dist/jquery.min.js",
           "node_modules/bootstrap/dist/js/bootstrap.js"
       ]

But Case is Bootstrap not work for the views 但是Case is Bootstrap对于视图不起作用

      <form >
          <div class="form-group">
            <label for="email">Email address</label>
            <input type="email" class="form-control" name="email" placeholder="Enter email" >
          </div>
          <div class="form-group">
            <label for="password">Password</label>
            <input type="password" class="form-control" name="password" placeholder="Password" >
          </div>
          <button type="submit" class="btn btn-success">Sign in!</button>
        </form>

Output-> 输出->

在此处输入图片说明

Could I know the mistake I have done? 我能知道我做错了吗?

将此添加到您的styles.css

@import "~bootstrap/dist/css/bootstrap.css";

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM