最新消息:雨落星辰是一个专注网站SEO优化、网站SEO诊断、搜索引擎研究、网络营销推广、网站策划运营及站长类的自媒体原创博客

javascript - AngularJS ng-view not loading template file content - Stack Overflow

programmeradmin0浏览0评论

I'm trying to set up a demo angular app but for some reason my partial (partials/test.html) content isn't loading into the layout file. Here's the index.html:

<!DOCTYPE html>
<html lang="en" ng-app="btq">
   <head>
      <meta charset="utf-8" />
      <title>NgView Test</title>
   </head>
   <body>
      <p>Some stuff on the page.</p>
      <div ng-view></div>
      <script src="js/angular.js"></script>
      <script src="js/app.js"></script>
   </body>
</html>

AngularJS is version 1.0.7. app.js contains the following:

'use strict';

// Declare app level module which depends on filters, and services
angular.module('btq', []).
  config(['$routeProvider', function($routeProvider) {
    $routeProvider.when('/dashbaord', {templateUrl: 'partials/test.html', controller: 'DashboardCtrl'});
    $routeProvider.otherwise({redirectTo: '/dashboard'});
  }]);

/* Controllers */

angular.module('btq.controllers', []).
  controller('DashboardCtrl', [function() {

  }]);

I'm obviously missing something simple. Any help would be appreciated!

I'm trying to set up a demo angular app but for some reason my partial (partials/test.html) content isn't loading into the layout file. Here's the index.html:

<!DOCTYPE html>
<html lang="en" ng-app="btq">
   <head>
      <meta charset="utf-8" />
      <title>NgView Test</title>
   </head>
   <body>
      <p>Some stuff on the page.</p>
      <div ng-view></div>
      <script src="js/angular.js"></script>
      <script src="js/app.js"></script>
   </body>
</html>

AngularJS is version 1.0.7. app.js contains the following:

'use strict';

// Declare app level module which depends on filters, and services
angular.module('btq', []).
  config(['$routeProvider', function($routeProvider) {
    $routeProvider.when('/dashbaord', {templateUrl: 'partials/test.html', controller: 'DashboardCtrl'});
    $routeProvider.otherwise({redirectTo: '/dashboard'});
  }]);

/* Controllers */

angular.module('btq.controllers', []).
  controller('DashboardCtrl', [function() {

  }]);

I'm obviously missing something simple. Any help would be appreciated!

Share Improve this question edited Apr 5, 2020 at 8:13 Dan 63.2k18 gold badges111 silver badges119 bronze badges asked Jun 9, 2013 at 8:55 novonnovon 9933 gold badges17 silver badges30 bronze badges
Add a ment  | 

2 Answers 2

Reset to default 2

May be its because of "typo". You wrote "dashbaord" instead of "dashboard" here:

$routeProvider.when('/dashbaord' , ...

Change

angular.module('btq.controllers', [])

to

angular.module('btq')

otherwise this creates a second app in your app.js

发布评论

评论列表(0)

  1. 暂无评论