Question

我正在开发一个应用程序，它在后端使用restful Web服务，在前端使用angularJS。我已经使用postman API客户端测试了CRUD操作的后端，它工作正常。我还测试了使用angular编写小尺寸HTML代码的Add和View操作，它也可以正常工作。我的问题是，我在这个所谓的“小尺寸HTML”中所做的并不适用于我真正的应用程序。任何人都可以帮我揭露我做错了什么。谢谢！

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>

Answer 1

在您的获取请求中，您仍然指向本地主机。假设您正在托管某个需要更换的地方

Angular不使用Restful webservice

1 个答案: