Блог

Главная - Вопросы по программированию - Не удается загрузить мой проект AngularJS 1.5.11

Не удается загрузить мой проект AngularJS 1.5.11

#angularjs

#angularjs

Вопрос:

 <!DOCTYPE html>
<html lang="en">

<head>
  <meta charset="utf-8">
  <meta name="viewport" content="width=device-width, initial-scale=1">
  <title>AngularJS CRUD</title>

  <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/materialize/1.0.0/css/materialize.min.css">
  <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.5.11/angular.min.js"></script>
  <script src="https://cdnjs.cloudflare.com/ajax/libs/angular.js/1.5.11/angular-route.min.js"></script>
  <script src="https://cdnjs.cloudflare.com/ajax/libs/materialize/1.0.0/js/materialize.min.js"></script>


  <script src="app.js"></script>


</head>

<body ng-app="myApp">
  <nav>
    <div class="nav-wrapper">
      <a href="#" class="brand-logo">CRUD</a>
      <ul id="nav-mobile" class="right hide-on-med-and-down">
        <li><a href="sass.html">Add</a></li>
        <li><a href="badges.html">Admin</a></li>
      </ul>
    </div>
  </nav>

  <div class="row">
    <div class="row">
      <form class="col s12">
        <div class="row">
          <div class="input-field col s6">
            <input placeholder="Placeholder" id="first_name" type="text" class="validate">
            <label for="first_name">First Name</label>
          </div>
          <div class="input-field col s6">
            <input id="last_name" type="text" class="validate">
            <label for="last_name">Last Name</label>
          </div>
        </div>
        <div class="row">
          <div class="input-field col s12">
            <input disabled value="I am not editable" id="disabled" type="text" class="validate">
            <label for="disabled">Disabled</label>
          </div>
        </div>
        <div class="row">
          <div class="input-field col s12">
            <input id="password" type="password" class="validate">
            <label for="password">Password</label>
          </div>
        </div>
        <div class="row">
          <div class="input-field col s12">
            <input id="email" type="email" class="validate">
            <label for="email">Email</label>
          </div>
        </div>
        <div class="row">
          <div class="col s12">
            This is an inline input field:
            <div class="input-field inline">
              <input id="email_inline" type="email" class="validate">
              <label for="email_inline">Email</label>
              <span class="helper-text" data-error="wrong" data-success="right">Helper text</span>
            </div>
          </div>
        </div>
      </form>
    </div>
  </div>
</body>

</html>

Мой app.js :

 var app = angular.module("myApp", []);

app.controller("addCtrl", function ($scope) {
  $scope.products = ["Milk", "Bread", "Cheese"];
});

Не уверен, почему, но я получаю сообщение об ошибке:
Uncaught Error: [$injector:modulerr] http://errors.angularjs.org/1.5.11/$injector/modulerr?p0=myAppamp;p1=Error: [$injector:moduler...

Ничего особенно конкретного.

Ответ №1:

В вашем файле JavaScript вы определяете контроллер с именем «addCtrl», но вы не включаете его в свой HTML.

Попробуйте использовать ng-controller =»addCtrl» в вашем теге body.