为什么模板是空白的?Angularjs

Why the template BLANK ? Angularjs

本文关键字:Angularjs 空白 为什么      更新时间:2023-09-26

我不知道为什么我的模板不再被渲染了。我得到一个空白页。在那之前它是工作的,经过一些调整后它停止工作了。我已经扭转了大部分的代码,我仍然不明白为什么不工作。控制台中没有任何类型的错误。我应该如何调试这种行为?

这是控制器

'use strict';
/* Controllers */
var crmControllers = angular.module('crmControllers', []);
crmControllers.controller('TimelineCtrl', ['$scope', '$routeParams', '$http',
 function($scope, $routeParams, $http) {
  var emailsId 
    emailsId = $routeParams.emailsId;
    $http.get('http://local.sf.com:8080/timeline/API?emailsId=' + emailsId, 
    {withCredentials: true}).success(function(timelines){
  angular.forEach(timelines, function(timeline) {
    var inboxIfr
    inboxIfr = 'http://local.sf.com:8080/messages/inbox?email='+
    timeline.Email+'&toEmail='+timeline.ToEmail+'&subject='+timeline.Subject
    timeline.inboxIfr = inboxIfr
    $scope.inboxIfr = inboxIfr
console.log(inboxIfr);
       });  
     });
}]);

inboxIfr显示在控制台日志中,这意味着循环正在发生,但它只是没有呈现。

Html

<body>
<ul ng-repeat="timeline in timelines">
<p>hello <p/>
 <iframe class="container well well-small span6"
           style="height: 400px;"
           ng-src="{{timeline.inboxIfr}}"></iframe>
</ul>

app.js

'use strict';
/* App Module */
var crmApp = angular.module('crmApp', [
  'ngRoute',
  'crmControllers',
]);
crmApp.config(['$routeProvider',
  function($routeProvider) {
    $routeProvider.
      when('/timeline/:emailsId', {
        templateUrl: 'partials/time.html',
        controller: 'TimelineCtrl'
      }).
      otherwise({
        redirectTo: '/timeline:emailsId'
      });
  }]);

index . html

<!doctype html>
<html lang="en" ng-app="crmApp">
<head>
  <meta charset="utf-8">
  <title>SF</title>
  <!--<<link rel="stylesheet" href="bower_components/bootstrap/dist/css/bootstrap.css">-->
  <!--<link rel="stylesheet" href="css/app.css">-->
  <script src="bower_components/angular/angular.js"></script>
    <script src="bower_components/angular-route/angular-route.js"></script>
<script src="js/controllers.js"></script>
<!--<script src="bower_components/angular-bootstrap/ui-bootstrap.min.js"></script>-->
<!--<script src="bower_components/angular-bootstrap/ui-bootstrap-tpls.min.js"></script>-->
      <script src="js/app.js"></script>

  <html>
</head>

<body>
 <div ng-view></div>
</body>
</html>

编辑:我在ng-repeat="timeline in timelines">上面添加了一些虚拟文本,它正在渲染,所以真正的问题是在ng-repeat循环中没有任何渲染。

编辑:我已经把time.html压缩到这个,它仍然没有被渲染。只显示第一段("I can see this")

    <p>I can see this</p>
<li ng-repeat="timeline in timelines">

<p>I can't see this <p/>
</li>

默认路由没有指向有效路由:

app.js:

.otherwise({
        redirectTo: '/timeline:emailsId'
      });
应:

.otherwise({
        redirectTo: '/timeline/:emailsId'
      });
编辑:更多HTML/Angular错误:
  • 移除Angular模板中的body标签。
  • 不要使用ng-repeat<ul>标签。而是使用<li>或其他块元素,如<div>
  • 您将ng-repeat与作用域变量timelines一起使用,但您从未设置$scope.timelines