#angularjs #grails
#angularjs #grails
Вопрос:
Я использую AngularJS в своем приложении grails. До этого я попробовал образец из Интернета. Я пытался использовать AngularJS $routeProvider для частичных представлений в моем основном представлении. Мои рабочие процессы следующие:
мой основной вид — index.gsp:
<!DOCTYPE html>
<html lang="en">
<head>
<title>AngularJS Routing example</title>
</head>
<body ng-app="routeApplication">
<div class="container">
<div class="row">
<div class="col-md-3">
<ul class="nav">
<li><a href="#AddNewOrder"> Add </a></li>
<li><a href="#ShowOrders"> Show </a></li>
</ul>
</div>
<div class="col-md-9">
<div ng-view></div>
</div>
</div>
</div>
<script src="js/angular.js"></script>
<script src="js/angular-route.js"></script>
<script src="js/app.js"></script>
</body>
</html>
Мои частичные представления: add_order.gsp и show_orders.gsp, чтобы показать пример сообщения для каждого представления.
мой app.js заключается в следующем:
var sampleApp = angular.module('routeApplication', ['ngRoute']);
sampleApp.config(['$routeProvider',
function($routeProvider) {
var base = '${request.contextPath}';
$routeProvider.
when('/AddNewOrder', {
templateUrl: 'templates/add_order.html',
controller: 'AddOrderController'
}).
when('/ShowOrders', {
templateUrl: 'templates/show_orders.gsp',
controller: 'ShowOrdersController'
}).
otherwise({
redirectTo: '/AddNewOrder'
});
}]);
sampleApp.controller('AddOrderController', function($scope) {
$scope.message = 'This is Add new order screen';
});
sampleApp.controller('ShowOrdersController', function($scope) {
$scope.message = 'This is Show orders screen';
});
Примечание: я создал папку templates и разместил в ней свои паритальные представления.
Эта проблема заключается в том, что всякий раз, когда я нажимаю, чтобы загрузить свои частичные представления, он показывает
`http://localhost/angularJSrouting/templates/show_orders.gsp`
404 Not Found
Я что-то упустил или есть какие-то проблемы с размещением частичных представлений?
Комментарии:
1. наконец-то сработало, папка шаблона должна быть помещена внутри webapp. в случае расширения html файла он работает как имя файла. но в случае gsp ему необходимо добавить символ подчеркивания и, что удивительно, после добавления формы множественного числа, подобной «s». в случае gsp: имя файла _show_orders.gsp и templateUrl templates/_show_orders.gsp
Ответ №1:
Я не думаю, что это сработает. Поскольку ваш templateUrl — templates/show_orders.gsp, angularjs попытается найти этот файл внутри папки templates в вашем веб-приложении.
Комментарии:
1. спасибо за ваш ответ, Риши Сараф. Я также разместил свои представления в webapp внутри папки templates, но это также не сработало. я был озадачен !!.
Ответ №2:
Вы должны перенаправить на
http://localhost/#/angularJSrouting/templates/show_orders.gsp url
можете ли вы использовать ‘/’ вместо ‘#’ в этой строке html
<li><a href="#AddNewOrder"> Add </a></li>
<li><a href="#ShowOrders"> Show </a></li>
Комментарии:
1. ‘/’ не работает. я пробовал перенаправление, как вы сказали, но тщетно.