Я разрабатываю приложение, и оно использует успокаивающий веб-сервис на заднем конце и угловойJS на передней панели. Я тестировал back end для CRUD-операций, используя клиент Postman API, и он отлично работает. Я также проверил операции «Добавить» и «Просмотреть», написав небольшой HTML-код с угловым, и он также отлично работает. Моя проблема в том, что то, что я сделал в этом так называемом «маленьком формате HTML», не работает в моем реальном приложении. Может ли кто-нибудь помочь мне узнать, что я сделал неправильно. Благодаря!Угловая не работает с Restful webservice
var myApp = angular.module('myApp', [
'ngRoute',
'specificProductControllers'
]);
myApp.config(['$routeProvider', function($routeProvider) {
$routeProvider.
when('/list', {
templateUrl: 'partials/list.html',
controller: 'ListController'
}).
when('/details/:itemId', {
templateUrl: 'partials/details.html',
controller: 'DetailsController'
}).
when('/login', {
templateUrl: 'partials/login.html',
controller: 'LoginController'
}).
when('/specificProductOrServiceAdd', {
templateUrl: 'partials/specificProductOrServiceAdd.html',
controller: 'SpecificProductOrServiceAddController'
}).
when('/adminPage', {
templateUrl: 'partials/adminPage.html',
controller: 'AdminPageController'
}).
when('/specificProducts', {
templateUrl: 'partials/specificProducts.html',
controller: 'SpecificProductsController'
}).
when('/specificProducts/:itemId', {
templateUrl: 'partials/specificProductOrServiceDetail.html',
controller: 'SpecificProductOrServiceDetailController'
}).
otherwise({
redirectTo: '/list'
});
}]);
<section>
<div class="col-sm-12 containerr">
<br><br>
{{2+4}}<br><br>
<!--The form goes here -->
<div class="form-group form-inline">
<br><br>
<div class="col-sm-6">
<label><h4>Enter Specific Product/Service Id:</h4> </label>
</div>
<div class="col-sm-6">
<input class="form-control" id="name" ng-model="specificProduct.specificProductId1" name="name" placeholder="Id" type="text" required>
</div>
</div>
<div class="form-group form-inline">
<br><br>
<div class="col-sm-6">
<label><h4>Enter Specific Product/Service Name:</h4> </label>
</div>
<div class="col-sm-6">
<input class="form-control" id="name" ng-model="specificProduct.specificProductName" name="name" placeholder="Name" type="text" required>
</div>
</div>
<br><br>
<div class="form-group form-inline">
<div class="col-sm-6">
<label><h4>Enter Specific Product/Service Price:</h4> </label>
</div>
<div class="col-sm-6">
<input class="form-control" id="name" ng-model="specificProduct.specificProductPrice" name="name" placeholder="Price" type="text" required>
</div>
</div>
<br><br>
<div class="form-group form-inline">
<div class="col-sm-6">
<label><h4>Enter Manufacturer/Service Provider Name:</h4> </label>
</div>
<div class="col-sm-6">
<input class="form-control" id="name" ng-model="specificProduct.specificProductManufacturerName" name="name" placeholder="Provider Name" type="text" required>
</div>
</div>
<br><br>
<div class="form-group form-inline">
<div class="col-sm-6">
<label><h4>Enter Specific Product/Service Model (If there is):</h4> </label>
</div>
<div class="col-sm-6">
<input class="form-control" id="name" name="name" ng-model="specificProduct.specificProductModel" placeholder="Model" type="text" required>
</div>
</div>
<br><br>
<div class="form-group form-inline">
<div class="col-sm-6">
<label for="sel1"><h4>Availablity:</h4></label>
</div>
<div class="col-sm-6">
<select class="form-control" >
<option>Available</option>
<option>Not Available</option>
</select>
</div>
</div>
<br><br>
<div class="form-group form-inline">
<div class="col-sm-6">
<label><h4>Enter Specific Product/Service Description:</h4> </label>
</div>
<div class="col-sm-6">
<textarea class="form-control" id="name" ng-model="specificProduct.specifcProductDescription" name="name" placeholder="Description" type="text" required></textarea>
</div>
</div>
<br><br>
<a href="#/specificProducts"><button type="button" class="btn btn-default" ng-click="addSpecificProduct(specificProduct)">+Add</button></a>
</div>
</section>
var specificProductControllers = angular.module('specificProductControllers', ['ngAnimate']);
specificProductControllers.controller('SpecificProductOrServiceAddController', ['$scope', '$http','$routeParams', function($scope, $http, $routeParams) {
$http.get('http://localhost:8080/marketServerNew/webapi/specificProduct/spv/sp5').success(function(data) {
$scope.readSpecificProduct = data;
})
$scope.addSpecificProduct = function(specificProduct) {
$http.post("http://localhost:8080/marketServerNew/webapi/specificProduct/spa", specificProduct).success(function(data) {
$scope.specificProduct = data;
})
}
}]);
<!doctype html>
<html lang="en" ng-app="myApp">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>My Website</title>
<link rel="stylesheet" href="css/reset.css">
<link rel="stylesheet" href="bootstrap/css/bootstrap.min.css">
<link rel="stylesheet" href="bootstrap/css/custom.css">
<script src="lib/angular/angular.min.js"></script>
<script src="lib/angular/angular-route.min.js"></script>
<script src="lib/angular/angular-animate.min.js"></script>
<script src="js/app.js"></script>
<script src="js/controllers.js"></script>
<link rel="stylesheet" href="css/style.css">
</head>
<body>
<div class="main" ng-view></div>
<script src="bootstrap/js/jquery-1.11.3.js"></script>
<script src="bootstrap/js/bootstrap.min.js"></script>
</body>
</html>
Определите «малый размер HTML» –
Кроме того, в вашем приложении реального времени я надеюсь, что вы изменили бы свои «http: // localhost: 8080 /» вхождения на ваш сервер имя. –
Ну, это форма для получения ввода и кнопка для добавления в базу данных. Он также считывает одну из записей из одной из таблиц в базе данных и загружает ее при запуске. – Dejazmach