Я думаю, что мой app.html из Angular не вводится

0

У меня есть навигатор, который я пытаюсь ввести на главную страницу. Я запустил страницу и проверил F12> Network, которая показала, что директива templateURL (navbar.html) либо не вызывалась, либо не вводилась. Ошибок нет. Кто-нибудь может понять, что может быть неправильным с моим кодом?

Структура каталогов:

  • landingpage.html
  • JS
    • контроллеры
      • NavController.js
    • директивы
      • navappDirective.js
    • app.js
  • шаблоны
    • navbar.html

Ниже приведен код:

landingpage.html

<html>
   <!-- Latest compiled and minified CSS -->
    <link rel="stylesheet" href="http://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css">

    <!--<link href="../css/landingpage.css" rel="stylesheet">-->

    <!-- jQuery library -->
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>

    <!-- Latest compiled JavaScript -->
    <script src="http://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/js/bootstrap.min.js"></script>

    <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.3.15/angular.min.js"></script>

    <meta name="viewport" content="width=device-width, initial-scale=1">

    <!--<script type="text/javascript">
        alert("this works");
    </script>-->

<body>
    <div>
        <navbar ></navbar>
    </div>
    <!-- Insert navbar-->

    <!-- Modules -->
        <script src="js/app.js"></script>

    <!-- Controllers -->
        <script src="js/controllers/NavController.js"></script>

    <!-- Directives -->
        <script src="js/directives/navappDirective.js"></script>

</body>

navappDirective.js

navapp.directive('navbar', function() {
  return { 
  restrict: 'E', 
  scope: { 

  }, 
  /*template: '<p>Hi</p>'*/
  templateUrl: 'templates/navbar.html' 
  }; 
});

navbar.html имеет только пункт для тестирования.

благодаря

  • 0
    Я думаю, что это проблема пути templateUrl. попробуйте поставить абсолютный путь шаблона
  • 0
    Переместите метатег в index.html файла index.html .
Показать ещё 3 комментария

2 ответа

0

Всем спасибо!

У меня было приложение ng-app в navbar, потому что именно там я использовал информацию о контроллере и думал, что это сработает.

Проблема была решена с помощью следующих шагов:

  • Изменен шаблонURL на.. /../templates/navbar.html
  • Вызывается директива ng-app на targetpage.html Это позволяет странице вызвать приложение. Все еще есть директива ng-controller в navbar для инкапсуляции.
  • После вышеуказанных шагов я все еще получил ошибку перекрестного ссылки, так как вы не можете вызвать html файл из файловой системы. Поэтому я запустил python-сервер, используя python -m http.server (для Python 3) после cd'ing в каталог, содержащий мой проект. Затем я мог запустить свой проект, используя localhost: 8000/
0

ng-app отсутствует в targetpage.html

В файле targpage.html, пожалуйста, обновите его, как показано ниже.

 <body ng-app="myapp">

В app.js вы, вероятно, должны иметь

angular.module('myapp',[]);
  • 1
    Пожалуйста, отредактируйте с дополнительной информацией. Ответы «только код» и «попробуй это» не приветствуются, потому что они не содержат контента для поиска и не объясняют, почему кто-то должен «попробовать это».

Ещё вопросы

Сообщество Overcoder
Наверх
Меню