AngularJs doens'；不能与Servlet通信_Angularjs_Database_Servlets

AngularJs doens'；不能与Servlet通信

angularjs database servlets

AngularJs doens'；不能与Servlet通信,angularjs,database,servlets,Angularjs,Database,Servlets,我正在编写一个简单的网页，它应该包含两个输入并插入到数据库中，但我正在尝试使用AngularJs。如果我不使用Angular，我可以与Servlet通信，它工作得很好，但我不能使用Angular。我在这里给你我的项目的所有细节。项目名称：AngularDb index.html <body data-ng-app="noteApp"> <div> <form data-ng-control="noteCtrl" ng-submit="addNote()

我正在编写一个简单的网页，它应该包含两个输入并插入到数据库中，但我正在尝试使用AngularJs。如果我不使用Angular，我可以与Servlet通信，它工作得很好，但我不能使用Angular。我在这里给你我的项目的所有细节。项目名称：AngularDb

index.html

<body data-ng-app="noteApp">
<div>
    <form data-ng-control="noteCtrl" ng-submit="addNote()">
        <div class="nameContainer">
        Inserisci il nome: <input type="text" name="nome" data-ng-model="nome"><br>
        </div>
        <div class="noteContainer">
        Inserisci qui una nota: <textarea rows="5" cols="50" name="note" data-ng-model="note"></textarea>
        <br>
        <button>Invia dati</button>
        </div>

    </form>
</div>

<?xml version="1.0" encoding="UTF-8"?>
<web-app xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xmlns="http://java.sun.com/xml/ns/javaee" xsi:schemaLocation="http://java.sun.com/xml/ns/javaee http://java.sun.com/xml/ns/javaee/web-app_3_0.xsd" id="WebApp_ID" version="3.0">
  <display-name>AngularDb</display-name>
  <welcome-file-list>
    <welcome-file>index.html</welcome-file>
    <welcome-file>index.htm</welcome-file>
    <welcome-file>index.jsp</welcome-file>
    <welcome-file>default.html</welcome-file>
    <welcome-file>default.htm</welcome-file>
    <welcome-file>default.jsp</welcome-file>
  </welcome-file-list>
  <servlet>
    <servlet-name>RegisterServlet</servlet-name>
    <servlet-class>RegisterServlet</servlet-class>
  </servlet>
  <servlet-mapping>
    <servlet-name>RegisterServlet</servlet-name>
    <url-pattern>/WebAppDbServlet</url-pattern>
  </servlet-mapping>
</web-app>

Servlet位于（默认包）中 RegisterServlet.java

import java.io.IOException;
import java.sql.Connection;
import java.sql.DriverManager;
import java.sql.PreparedStatement;
import java.sql.SQLException;

import javax.servlet.ServletException;
import javax.servlet.annotation.WebServlet;
import javax.servlet.http.HttpServlet;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;

@WebServlet("/WebAppDbServlet")
public class RegisterServlet extends HttpServlet {
    private static final long serialVersionUID = 1L;

       // JDBC driver name and database URL
       static final String JDBC_DRIVER = "org.gjt.mm.mysql.Driver";  
       static final String DB_URL = "jdbc:mysql://localhost:3306/fabio";

       //  Database credentials
       static final String USER = "root";
       static final String PASS = "*******";


    public RegisterServlet() {
        super();
    }

    protected void doGet(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
        response.getWriter().append("Served at: ").append(request.getContextPath());
    }

    protected void doPost(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
        doGet(request, response);
        Connection conn=null;
        try{
            String Name = request.getParameter("nome");
            String Note = request.getParameter("note");
            Class.forName("org.gjt.mm.mysql.Driver");
            conn = DriverManager.getConnection(DB_URL, USER, PASS);
            String sql = "INSERT INTO fabio.appunti (nome, note) values ('"+Name+"', '"+Note+"');";
            PreparedStatement psSql = conn.prepareStatement(sql);
            psSql.executeUpdate();
        }catch(Exception e){
            e.printStackTrace();
        }finally{
            try{
                if(conn!=null)
                    conn.close();
            }catch(SQLException se){
                se.printStackTrace();
            }
        }
    }

}

web.xml

<body data-ng-app="noteApp">
<div>
    <form data-ng-control="noteCtrl" ng-submit="addNote()">
        <div class="nameContainer">
        Inserisci il nome: <input type="text" name="nome" data-ng-model="nome"><br>
        </div>
        <div class="noteContainer">
        Inserisci qui una nota: <textarea rows="5" cols="50" name="note" data-ng-model="note"></textarea>
        <br>
        <button>Invia dati</button>
        </div>

    </form>
</div>

<?xml version="1.0" encoding="UTF-8"?>
<web-app xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xmlns="http://java.sun.com/xml/ns/javaee" xsi:schemaLocation="http://java.sun.com/xml/ns/javaee http://java.sun.com/xml/ns/javaee/web-app_3_0.xsd" id="WebApp_ID" version="3.0">
  <display-name>AngularDb</display-name>
  <welcome-file-list>
    <welcome-file>index.html</welcome-file>
    <welcome-file>index.htm</welcome-file>
    <welcome-file>index.jsp</welcome-file>
    <welcome-file>default.html</welcome-file>
    <welcome-file>default.htm</welcome-file>
    <welcome-file>default.jsp</welcome-file>
  </welcome-file-list>
  <servlet>
    <servlet-name>RegisterServlet</servlet-name>
    <servlet-class>RegisterServlet</servlet-class>
  </servlet>
  <servlet-mapping>
    <servlet-name>RegisterServlet</servlet-name>
    <url-pattern>/WebAppDbServlet</url-pattern>
  </servlet-mapping>
</web-app>


角度数据库
index.html
index.htm
index.jsp
default.html
default.htm
default.jsp
注册服务器
注册服务器
注册服务器
/WebAppDbServlet

如果，而不是

<form data-ng-control="noteCtrl" ng-submit="addNote()">

我写这个

<form action="WebAppDbServlet" method="Post" data-ng-control="noteCtrl">

我知道它很好用，所以我知道问题出在AngularJs上。

试试这个

<form data-ng-control="noteCtrl">
 <div class="nameContainer">
    Inserisci il nome: <input type="text" name="nome" data-ng-model="data.nome"><br>
 </div>
 <div class="noteContainer">
    Inserisci qui una nota: <textarea rows="5" cols="50" name="note" data-ng-model="data.note"></textarea>
    <br>
 </div> 
 <button ng-click="addNote(data)>Invia dati</button>
</form>

我对您的代码进行了一些修改，得到了一个答案，它对我来说运行良好： HTML代码：

    <body data-ng-app="noteApp">
<div>
    <form action="RegisterServlet" method="Post" data-ng-control="noteCtrl">

        <div class="nameContainer">
        Name: <input type="text" name="nome" data-ng-model="nome"><br>
        </div>
        <div class="noteContainer">
        Note: <textarea rows="5" cols="50" name="note" data-ng-model="note"></textarea>
        <br>
        <button>Save</button>
        </div>

    </form>
</div>
<script>
var app=angular.module('noteApp', [])
app.controller('noteCtrl', function ($scope, $http){

 $scope.addNote = function () {
 $http({
   method: 'POST',
   url: 'http://localhost:8080/AngularJsSample/RegisterServlet',
   data: {"name":$scope.nome, "note":$scope.note}
  })
 }
})
</script>
</body>
</html>

您是否将post数据发送到后端？您的意思是将“doGet”方法中的数据发送到Servlet中？您正在从angular执行post，因此它应该是doPostCorrect，这就是我所做的（如您所见）。。。对不起，我想我没听清你上面的问题，所以我的意思是，你能做一个检查，看看有什么数据从前端的帖子发送到后端，看看它是否符合你需要的数据。不，这不起作用。这和以前完全一样

RegisterServlet.java

import java.io.IOException;
import java.io.PrintWriter;
import java.sql.Connection;
import java.sql.DriverManager;
import java.sql.PreparedStatement;
import java.sql.SQLException;

import javax.servlet.ServletException;

import javax.servlet.http.HttpServlet;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;


public class RegisterServlet extends HttpServlet {

    protected void doPost(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {

        Connection conn=null;
        try{
            String Name = request.getParameter("nome");
            String Note = request.getParameter("note");
            PrintWriter out=response.getWriter();
            Class.forName("oracle.jdbc.driver.OracleDriver");
            conn = DriverManager.getConnection("jdbc:oracle:thin:@localhost:1521:xe","swetha","shwe");
            out.println(conn);
            PreparedStatement pst=conn.prepareStatement("insert into sample values(?,?)");
            pst.setString(1,Name);
            pst.setString(2, Note);

            int i=pst.executeUpdate();
            out.println(i);
        }catch(Exception e){
            e.printStackTrace();
        }finally{
            try{
                if(conn!=null)
                    conn.close();
            }catch(SQLException se){
                se.printStackTrace();
            }
        }
    }

}