AngularJS的休息服务

时间:2015-01-13 18:43:34

标签: java javascript angularjs web-services rest

我正在使用AngularJS学习Restfull Web服务。我做了一个应用程序但是当我调用get资源方法时,没有任何事情发生,字面上没有任何事情发生。我没有在萤火虫中看到。 Web服务没有被调用。但是当我在网络浏览器中直接运行它时,Web服务就会运行。

这是代码。 Controller.js

var ai = angular.module("ai", [ 'ui.bootstrap', 'ngResource']);

ai.controller("playerSelection",["$scope",
                    "$http",
                    "services",
                    function($scope, services) {
                        $scope.selectPlayers = function() {
                            console.log("Select Players Function");
                            $scope.row = 3;
                            $scope.col = 3;
                            $scope.map = ".........";
                            $scope.playerOne = {
                                "name" : "",
                                "image" : "./images/cross.jpg",
                                "turn" : true,
                                "symbol" : "x"
                            };
                            $scope.playerTwo = {
                                "name" : "",
                                "image" : "./images/right.jpg",
                                "turn" : false,
                                "symbol" : "*"
                            };

                            if ($scope.player == "option1") {
                                $scope.playerOne.name = "Computer";
                                $scope.playerTwo.name = "Player One";
                            } else {
                                if ($scope.player == "option2") {
                                    $scope.playerOne.name = "Player One";
                                    $scope.playerTwo.name = "Player Two";
                                } else {
                                    $scope.playerOne.name = "Computer One";
                                    $scope.playerTwo.name = "Computer Two";
                                }
                            }
                            $scope.beginGame = true;
                            $scope.moves = 0;
                            console.log($scope.playerOne);
                            console.log($scope.playerTwo);
                            console.log($scope.map);

                            /*
                             * services.get({}, function(userFactory) {
                             * console.log(userFactory); $scope._temp =
                             * userFactory;
                             * 
                             * });
                             */

                            $scope.isgameOver = function() {
                                console.log("Inside Game Over");
                                /*
                                 * $http({ method:'GET', headers: {
                                 * 'Content-Type': 'application/json;
                                 * charset=UTF-8' },
                                 * url:"http://localhost:8080//CustomWebServiceCliet/services/gameOver" })
                                 * .success(function(data, status, headers) {
                                 * console.log("data="); console.log(data);
                                 * return data; }).error(function(data,
                                 * status, headers) { console.log("Error");
                                 * alert("Error"); });
                                 * 
                                 */

                                services.get({}, function(userFactory) {
                                     console.log(userFactory); $scope._temp =
                                     userFactory;
                                });
                            };
                        };
                    } ]);


  ai.factory('services', function($resource) { return    $resource('http://localhost:8080    //CustomWebServiceCliet/services/gameOver',
{}, { query : { method : 'GET', params : {}, isArray : false } }); });

ai
    .directive(
            "move",
            function($compile) {

                var link = function(scope, element, attrs) {
                    var childs = angular.element(element.children());
                    console.log("Children of Move directive");
                    console.log(childs);

                    element
                            .bind(
                                    "click",
                                    function(event) {
                                        /*
                                         * Place the player symbol in the
                                         * click location
                                         */
                                        console.log("PlaceMove Function");
                                        scope.moves++;
                                        var _target_id = $(event.target);
                                        if (scope.playerOne.turn == true) {
                                            _target_id
                                                    .append($compile(
                                                            "<div><img class='moveImages' src='"
                                                                    + scope.playerOne.image
                                                                    + "'></div>")
                                                            (scope));
                                            scope.playerOne.turn = false;
                                            scope.playerTwo.turn = true;
                                        } else {
                                            _target_id
                                                    .append($compile(
                                                            "<div><img class='moveImages' src='"
                                                                    + scope.playerTwo.image
                                                                    + "'></div>")
                                                            (scope));
                                            scope.playerOne.turn = true;
                                            scope.playerTwo.turn = false;
                                        }
                                        /*
                                         * Transformation Logic and updating
                                         * map
                                         */
                                        // console.log(angular.element(
                                        // childs[0]).offset());
                                        // console.log(_target_id.offset());
                                        var i = 0;
                                        for (; i < childs.length; i++) {
                                            if (angular.element(childs[i])
                                                    .offset().top == _target_id
                                                    .offset().top
                                                    && angular.element(
                                                            childs[i])
                                                            .offset().left == _target_id
                                                            .offset().left) {

                                                console.log("FOUND");
                                                break;
                                            }
                                            ;
                                        }
                                        String.prototype.replaceAt = function(
                                                index, character) {
                                            return this.substr(0, index)
                                                    + character
                                                    + this
                                                            .substr(index
                                                                    + character.length);
                                        };
                                        console.log(i);
                                        if (scope.playerOne.turn == false)
                                            scope.map = scope.map
                                                    .replaceAt(
                                                            i,
                                                            scope.playerOne.symbol);
                                        else
                                            scope.map = scope.map
                                                    .replaceAt(
                                                            i,
                                                            scope.playerTwo.symbol);

                                        console.log(scope.map);
                                        /*
                                         * Sent map payload to web service
                                         * to check if the game is finished
                                         */

                                          if (scope.isgameOver() == true)
                                          console.log("It works"); else
                                          console.log("Not working");

                                    });
                };
                return {
                    restrict : 'E',
                    link : link
                };
            });

Web.xml中

 <?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>tictactoe</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>Jersey REST Service</servlet-name>
    <servlet-class>org.glassfish.jersey.servlet.ServletContainer</servlet-class>
     <!-- Register resources and providers under com.vogella.jersey.first package. -->
    <init-param>
        <param-name>jersey.config.server.provider.packages</param-name>
        <param-value>com.AI.services</param-value>
    </init-param>
    <load-on-startup>1</load-on-startup>
  </servlet>
  <servlet-mapping>
    <servlet-name>Jersey REST Service</servlet-name>
<url-pattern>/services/*</url-pattern>

的WebService

package com.AI.services;

import javax.ws.rs.Consumes;
import javax.ws.rs.GET;
import javax.ws.rs.Path;
import javax.ws.rs.PathParam;
import javax.ws.rs.Produces;
import javax.ws.rs.QueryParam;
import javax.ws.rs.core.MediaType;
import javax.ws.rs.core.Request;
import javax.ws.rs.ext.Provider;

@Provider
@Path("/")

public class TicTacToeService {

    public TicTacToeService() {
        // TODO Auto-generated constructor stub
    }

    @Path("gameOver")
    @GET()
    //@Consumes({ MediaType.APPLICATION_JSON, MediaType.APPLICATION_XML })
    @Produces({ MediaType.APPLICATION_JSON, MediaType.APPLICATION_XML,
            MediaType.TEXT_PLAIN })
    public String isGameOver() {
        /*
         * function: Check if the game is finished for nxn map
         * 
         * @Param map: pay load consisting of n^2 element string
         * 
         * @returns: true of the game is over, false otherwise
         */

        System.out.println("Tnside Web Service");
        return "true";
    }
}

0 个答案:

没有答案