Question

您好我的代码存在问题，我似乎无法在我的模板中加载我的观点。

以下是我的标签：

<script language="JavaScript" type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/angularjs/1.6.6/angular.min.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.6.6/angular-route.js"></script>

这是我的JS：

angular.module('dnsApp', ["ngRoute"])

var app = angular.module('dnsApp');

app.config(['$routeProvider', function($routeProvider) {
$routeProvider
  .when('/', {
    templateUrl: 'views/reporting.html'
  })
  .when('/reporting', {
    templateUrl: 'views/reporting.html'
  })
  .when('/detectionSummary', {
    templateUrl: 'views/detection-summary.html'
  })
  .when('/operationalMetrics', {
    templateUrl: 'views/operational-metrics.html'
  });
}]);

这是我的HTML：

 <ul class="nav navbar-nav">
    <li class="active"><a href="#!reporting"><i class="fa fa-dashboard"></i> <span class="sr-only">(current)</span></a></li>
    <li><a href="#!detectionSummary"><i class="fa fa-bolt"></i></a></li>
    <li><a href="#!operationalMetrics"><i class="fa fa-bar-chart"></i></a></li>
  </ul>

没有任何东西出现，我对AngularJs相对较新，所以任何帮助都会非常感激。谢谢！

Answer 1

您不应该再次声明模块，将其更改为

//remove this line angular.module('dnsApp', ["ngRoute"])
var app = angular.module('dnsApp', ["ngRoute"])

app.config(['$routeProvider', function($routeProvider) {
$routeProvider
  .when('/', {
    templateUrl: 'views/reporting.html'
  })
  .when('/reporting', {
    templateUrl: 'views/reporting.html'
  })
  .when('/detectionSummary', {
    templateUrl: 'views/detection-summary.html'
  })
  .when('/operationalMetrics', {
    templateUrl: 'views/operational-metrics.html'
  });
}]);

Answer 2

您应该将模块js添加到“索引”中的标签。

也是主索引中的ng-view。

文档：https://docs.angularjs.org/api/ngRoute/directive/ngView

视图未加载ngRoute

2 个答案: