Создайте файл контроллера в отдельной папке с помощью angular.js

Мне нужно сохранить страницу контроллера в отдельной папке. Но она показывает мне ошибку ниже.Создайте файл контроллера в отдельной папке с помощью angular.js

Error: [ng:areq] http://errors.angularjs.org/1.4.6/ng/areq?p0=homecontroller&p1=not%20aNaNunction%2C%20got%20undefined 
    at Error (native)

Я объясняю свой код ниже.

app.js:

var GoFastoApp=angular.module('GofastoHome',['ngRoute']); 
GoFastoApp.config(function($routeProvider) { 
    $routeProvider 
    .when('/',{ 
     templateUrl : 'view/home.html', 
     controller : 'homecontroller' 
    }) 
    .when('/deptinfo',{ 
     templateUrl : 'view/info.html', 
     controller : 'infocontroller' 
    }) 
    .when('/TimeTable',{ 
     templateUrl : 'view/time.html', 
     controller : 'timecontroller' 
    }) 
    .when('/course',{ 
     templateUrl : 'view/course.html', 
     controller : 'coursecontroller' 
    }) 
    .when('/subject',{ 
     templateUrl : 'view/subject.html', 
     controller : 'subjectcontroller' 
    }) 
    .when('/hod',{ 
     templateUrl : 'view/hod.html', 
     controller : 'hodcontroller' 
    }) 
    .when('/faculty',{ 
     templateUrl : 'view/faculty.html', 
     controller : 'facultycontroller' 
    }) 
})

В приведенной выше коде я объявил другой контроллер для различных template.All частичного шаблон будет добавить в главной странице ниже.

index.html:

<!DOCTYPE html> 
<html lang="en" ng-app="GofastoHome"> 
<head> 

    <meta charset="utf-8"> 
    <meta name="viewport" content="width=device-width, initial-scale=1.0"> 
    <meta name="description" content=""> 
    <meta name="author" content=""> 

    <title>...:::WELCOME TO Channabasavashwara Institude of Technology:::...</title> 

    <!-- PACE LOAD BAR PLUGIN - This creates the subtle load bar effect at the top of the page. --> 
    <script src="js/angularjs.js" type="text/javascript"></script> 
    <script src="js/angularroute.js" type="text/javascript"></script> 
    <script src="controller/app.js" type="text/javascript"></script> 
    <!-- GLOBAL STYLES - Include these on every page. --> 
    <link href="css/bootstrap.min.css" rel="stylesheet"> 

    <link href="css/style22.css" rel="stylesheet"> 
    <link href="css/style.css" rel="stylesheet"> 
</head> 

<body> 
<nav class="navbar navbar-default navbar-fixed-top" style="margin-top:50px"> 
     <div class="container" style="width:1270px;"> 
     <div class="navbar-header navbar-brand"> 
     Computer Science & Engineering 
     </div> 
     <div id="navbar" class="navbar-collapse collapse"> 
      <ul class="nav navbar-nav"> 
      <li class="active"><a href="#">Home</a></li> 
      <li><a href="#about">Dept. info</a></li> 
      <li><a href="#contact">Time Table</a></li> 
      <li class="dropdown"> 
       <a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-haspopup="true" aria-expanded="false">Edit <span class="caret"></span></a> 
       <ul class="dropdown-menu"> 
       <li><a href="/course">Course</a></li> 
       <li><a href="/subject">Subject</a></li> 
       <li><a href="/hod">HOD</a></li> 
       <li role="separator" class="divider"></li> 
       <li class="dropdown-header">Nav header</li> 
       <li><a href="/faculty">Faculty</a></li> 
       <li><a href="#">One more separated link</a></li> 
       </ul> 
      </li> 
      </ul> 
      </div><!--/.nav-collapse --> 
     </div> 
    </nav> 
     <!--main_heading_div--> 
     <!--middle_content_details_data--> 
     <div class="row" style="padding-top:90px;" ng-view> 


     </div> 
     <!--end_middle_content_details_data--> 

    </div> 
    <!-- /.page-content --> 

</div> 
</div> 
<script src="js/bootstrap.min.js"></script> 
    <script type="text/javascript" src="js/jquery.slimscroll.min.js"></script> 
    <script src="js/jquery.popupoverlay.js"></script> 
    <!--<script src="controller/HomeController.js" type="text/javascript"></script>--> 
</body> 
</html>

Здесь мне нужно предположить, для home.html частичного шаблона я создам новый файл HomeController в отдельной папке и включить этот файл в мастер page.Here я создал один файл (i.e-HomeController.js), который приведен ниже.

HomeController.js:

var homeapp=angular.module('GofastoHome',[]); 
homeapp.controller('homecontroller',function($scope){ 

})

Когда я включить этот файл я не получил какой-либо частичный шаблон и, когда я удалил этот файл ссылку с главной страницы (i.e-index.html) выше ошибка приходит. Пожалуйста, помогите мне решить эту проблему. Я использую angular.js версию 1.4.6.

источник

2015-09-28 satya

Я не очень понимаю вопрос ... Конечно, вы должны включать в себя все необходимые файлы в index.html ... – Gustav

Может лет создать plunker для вашего вопроса ? Я думаю, проблема связана с вашим способом инициализации модуля AngularJs и включения всех файлов. –

@Gustav: Но после включения частичного шаблона не идет.Здесь мое требование - сохранить файл контроллера в одной папке и выполнить соответствующий шаблон. – satya

Чтобы получить ссылку на существующий модуль, вы не должны объявлять список зависимостей! Снимите кронштейны и он должен работать.

var homeapp=angular.module('GofastoHome');

источник

2015-09-28 09:13:26 Michael

: Спасибо, что ваша работа сработала. – satya

Всегда включайте Угловой файл плагина, а затем включить приложение app.js, конфигурационные файлы, если какие-либо и в конце включают все угловые модули зависимости, созданные как услуги, директивы, заводы и на последние контроллеры.

app.js

// Angular Module initialization 
var goFastoApp=angular.module('GofastoHome',['ngRoute']); 

// Config Block 
GoFastoApp.config(function($routeProvider) { 
    $routeProvider 
    .when('/',{ 
     templateUrl : 'view/home.html', 
     controller : 'homecontroller' 
    }) 
});

home.controller.js

// Рассмотрим этот код, добавленный в отдельном файле для контроллера

goFastoApp.controller('homecontroller',function($scope){ 
    $scope.username = "Satya"; 
})

index.html

<!DOCTYPE html> 
<html lang="en" ng-app="GofastoHome"> 
<head> 

    <meta charset="utf-8"> 
    <meta name="viewport" content="width=device-width, initial-scale=1.0"> 
    <meta name="description" content=""> 
    <meta name="author" content=""> 

    <title>...:::WELCOME TO Channabasavashwara Institude of Technology:::...</title> 

    <!-- PACE LOAD BAR PLUGIN - This creates the subtle load bar effect at the top of the page. --> 

    <!-- GLOBAL STYLES - Include these on every page. --> 
    <link href="css/bootstrap.min.css" rel="stylesheet"> 
    <link href="css/style22.css" rel="stylesheet"> 
    <link href="css/style.css" rel="stylesheet"> 
</head> 

<body> 
    <!-- Page Content --> 

    <!-- Plugin Files --> 
    <script src="js/angularjs.js" type="text/javascript"></script> 
    <script src="js/angularroute.js" type="text/javascript"></script> 
    <script src="js/bootstrap.min.js"></script> 
    <script type="text/javascript" src="js/jquery.slimscroll.min.js"></script> 
    <script src="js/jquery.popupoverlay.js"></script> 
    <!-- End Plugin Files --> 

    <!-- JS Files --> 
    <script src="controller/app.js" type="text/javascript"></script> 
    <script src="controller/HomeController.js" type="text/javascript"></script> 
    <!-- End JS Files --> 
</body> 
</html>

источник

2015-09-28 09:36:58

Создайте файл контроллера в отдельной папке с помощью angular.js

ответ

Смежные вопросы