Question

我在angular-cli基础知识方面遇到了一些问题。在一个基本项目中，我有一个使用一些js脚本的索引页。

示例：

的index.html
我的代码
js scripts

通过这种方式我的页面工作正常。

如果我移动app.component.ts中的代码并使用<app-root></app-root>将其注入，则js脚本无法运行。

我错过了什么吗？

我的index.html

＆＃13;

<head>
		<!-- head stuff and css imports-->
</head>

		<body id="page-top">

		<!-- APP ROOT -->
  		<app-root>Loading...</app-root>

  		<!-- jQuery 3 -->
		<script src="assets/bower_components/jquery/dist/jquery.min.js"></script>
		<!-- Bootstrap 3.3.7 -->
		<script src="assets/bower_components/bootstrap/dist/js/bootstrap.min.js"></script>

		<!-- Plugin JavaScript -->
		<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery-easing/1.3/jquery.easing.min.js"></script>
		<script src="assets/scrollreveal/scrollreveal.min.js"></script>
		<script src="assets/magnific-popup/jquery.magnific-popup.min.js"></script>
		<!-- Theme JavaScript -->
		<script src="assets/js/creative.min.js"></script>

		</body>

＆＃13;

我的app.component.html

＆＃13;

<nav id="mainNav" class="navbar navbar-default navbar-fixed-top">
  <div class="container-fluid">
      <!-- Brand and toggle get grouped for better mobile display -->
      <div class="navbar-header">
          <button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#bs-example-navbar-collapse-1">
              <span class="sr-only">Toggle navigation</span> Menu <i class="fa fa-bars"></i>
          </button>
            <a href="#page-top" class="page-scroll">
                <img src="assets/img/prov/LogoPollicIoT_Verde.png" alt="brand" class="navbar-brand">
            </a>
          
      </div>

      <!-- Collect the nav links, forms, and other content for toggling -->
      <div class="collapse navbar-collapse" id="bs-example-navbar-collapse-1">
          <ul class="nav navbar-nav navbar-right">
              <li>
                  <a class="page-scroll" href="#about">About</a>
              </li>
              <li>
                  <a class="page-scroll" href="#services">Services</a>
              </li>
              <li>
                  <a class="page-scroll" href="#portfolio">Portfolio</a>
              </li>
              <li>
                  <a class="page-scroll" href="#contact">Contact</a>
              </li>
              <li>
                  <a class="page-scroll" href="#page-top">Login</a>
              </li>
          </ul>
      </div>
      <!-- /.navbar-collapse -->
  </div>
  <!-- /.container-fluid -->
</nav>

<header>
  <div class="header-content">
    <div class="row">
      <div class="col-lg-7 col-md-7 text-center">
        <div class="header-content-inner header-image">
        </div>
      </div>
      <div class="col-lg-4 col-lg-offset-1 text-center">
        <div>
            <div>
            <div class="col-lg-12">
                <img src="assets/img/prov/LogoPollicIoT_Verde.png" class="img-responsive" alt="">
            </div> 
            <h3 id="homeHeading" class="colorBlack"></h3>
            <hr>
            <p class="colorBlack"></p>
          </div>
          <div class="well well-sm form-background-color"> 
            <h2>Log in</h2>
            <form>
                <div class="form-group">
                    <input type="email" class="form-control" placeholder="Email" ng-model="user.email">
                </div>
                <div class="form-group">
                    <input type="password" class="form-control" placeholder="Password" ng-model="user.password" ng-minlength="6">
                </div>
                <div class="alert alert-danger" ng-if="home.error">
                    <strong>There was an error: </strong> {{error.error}}{{error.error}}
                    <br>Error...
                </div>
                <button class="btn btn-primary" ng-click="home.login()">Log in</button>
                <a class="btn btn-default" ng-click="home.signup()">Sign Up</a>
            </form>
        </div>
        </div>
      </div>
    </div>

                <a href="#about" class="btn btn-primary btn-xl page-scroll">Find out more</a>
  </div>
</header>

<!-- other stuff as section-->

＆＃13;

这是索引html和注入的组件的代码。 js创意和其他用于一些平滑的动作，如果不在主要部分，更改导航栏等。

注入的angular-cli组件有js脚本问题

0 个答案: