2017-08-16 25 views
0

我有一个加载一个简单的页面将显示所有消息的问题。我在后端使用algular作为前端和Spring启动应用程序。当我尝试加载页面(本地主机:8080 /消息),页面是空白的,并给我下载与消息的JSON。任何想法? PS。在ViewAllMessages.html中,我编写常量文本来检查页面何时运行。为什么页面没有加载Java Spring引导Angularjs

MessageController:

@RestController 
@RequestMapping("/api/message") 
public class MessageController { 

private final Logger LOG = LoggerFactory.getLogger(MessageController.class); 

@Autowired 
private MessageService messageService; 

@RequestMapping(value = "/all", method = GET) 
public List<MessageDTO> findAll() { 
    LOG.info("Received request to all messages."); 
    return messageService.findAll(); 
} 
} 

main.js

var chatApp = angular.module('chat', ['ngRoute']); 

chatApp.config(function ($routeProvider) { 
$routeProvider 
    .when('/messages', 
     { 
     controller: 'AllMessagesController', 
     templateURL: '/partials/ViewAllMessages.html' 
     }) 
    .otherwise({redirectTo: '/'}); 
}); 

chatApp.service('messageService', function(){ 
var message = {}; 

var addMessage = function (v) { 
    message = v; 
}; 
var getMessage = function(){ 
    return message; 
}; 

return { 
    addMessage: addMessage, 
    getMessage: getMessage 
}; 

}); 

chatApp.controller('AllMessagesController', function($scope, $window, $http){ 
$scope.transfer = {}; 
$scope.error = false; 
$http 
    .get('/api/message/all') 
    .then(function(response) { 
     $scope.messages = response.data; 
     log.console(response.data); 
    }); 
}); 

的index.html

<!doctype html> 
<html> 
<link href="css/bootstrap.min.css" rel="stylesheet"> 
<link href="css/simple-sidebar.css" rel="stylesheet"> 
<link href="css/bootstrap-datetimepicker.css" rel="stylesheet"> 
<link href="css/office.css" rel="stylesheet"> 
<style type="text/css"> </style> 
<body> 

<script src="js/angular-route.min.js" type="text/javascript"></script> 
<script src="js/angular-resource.min.js" type="text/javascript"></script> 
<script src="js/main.js"></script> 
<script src="js/angular.min.js" type="text/javascript"></script> 

</body> 

</html> 

ViewAllMessages.html

<div class="container"> 
<div class="col-md-6"> 
    <div class="row"> 
     <div class="col-md-2"> 
      <h2>Wiadomosci</h2> 
     </div> 
    </div> 

</div>> 

<div class="section"> 
    <h3>{{headingTitle}}</h3> 
    <div> 
     <ul type="square"> 
      <li>Luke</li> 
      <li>Darth</li> 
      <li>Anakin</li> 
      <li>Leia</li> 
     </ul> 
    </div> 
</div> 

<div class="panel panel-default" ng-repeat="message in messages"> 

    <div class="row"> 
     <div class="col-md-2"> 
      <div class="panel-default"> {{message.id}}</div> 
     </div> 
     <div class="col-md-2"> 
      <div class="panel-default"> {{message.message}}</div> 
     </div> 
    </div>> 
</div> 
</div> 
+0

首先我在index.html中看到脚本导入的顺序,所以试着把firirs.min.js放进去。 –

+0

我做了,但没有工作; / –

回答

0

页面未显示,因为您没有导入$ routeParams依赖于您的控制器index.js。设置后,页面显示。

相关问题