引导模式不会在基本的ASP.NET Core Web角度应用程序中显示

时间:2019-02-06 15:57:40

标签: asp.net twitter-bootstrap visual-studio-2017

我是所有浏览器用户界面工具的新手。我一直在研究一个简单的angular / typescript应用程序。我使用VS2017 ASP.NET核心Web应用程序模板创建了一个有角度的应用程序。我无法显示模式窗口。

我已经看到了几个答案,说明您需要包括jquery和/或bootstrap.js。但是我不知道在这个项目中在哪里指定。我使用nuget来安装angular,bootstrap,甚至没有运气就安装了jquery和jquery.ui.com。

<h1>Hello, world!</h1>
<p>Welcome to your new single-page application, built with:</p>

<!-- Trigger the modal with a button -->
<button type="button" class="btn btn-info btn-lg" data-toggle="modal" data-target="#myModal">Open Modal</button>

<!-- Modal -->
<div id="myModal" class="modal fade" role="dialog">
  <div class="modal-dialog">

    <!-- Modal content-->
    <div class="modal-content">
      <div class="modal-header">
        <button type="button" class="close" data-dismiss="modal">&times;</button>
        <h4 class="modal-title">Modal Header</h4>
      </div>
      <div class="modal-body">
        <p>Some text in the modal.</p>
      </div>
      <div class="modal-footer">
        <button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
      </div>
    </div>

  </div>
</div>

我已经尝试了很多不同的示例来展示模态,但是我还没有进行模态展示。

2 个答案:

答案 0 :(得分:1)

我新来的东西是只有新手才知道的东西。我只需要在'angular.json'中包含jquery和bootstrap脚本。我将以下内容添加到“脚本”数组中。

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

答案 1 :(得分:0)

我可以确认使用Visual Studio 2019 Angular模板也可以使用。

在“ angular.json”中添加了提及的脚本,例如:

       "styles": [
          "node_modules/bootstrap/dist/css/bootstrap.min.css",
          "src/styles.css",
          "src/assets/fonts/fonts-fontname.css"
        ],
        "scripts": [
          "./node_modules/jquery/dist/jquery.min.js",
          "./node_modules/bootstrap/dist/js/bootstrap.min.js"
        ]

谢谢托尼!