AngularJS - Integração de serviços SOAP com o modelo AngularJS

Question

Jul 05, 2013, 03:50 PM

AngularJS - Integração de serviços SOAP com o modelo AngularJS

Eu sou um experiente Flex Developer que está aprendendo AngularJS. Isso é tão confuso !!!

De qualquer forma, estou tentando fazer uma chamada de serviço para meu servidor de backend (no mesmo domínio) por meio de uma Solicitação WSDL SOAP e preencher os dados com um objeto de modelo AngularJS. Eu estava tentando Ajax, mas estava tendo alguns problemas com a obtenção dos dados reais de volta. Eu acho que há algo errado com a maneira que eu criei a tag SOAP. Eu estava recebendo uma resposta bem-sucedida de volta, mas sem dados.

Depois de não conseguir descobrir o método Ajax, encontrei o soapclient.js e achei extremamente fácil, com menos código do que o Ajax. O soapclient.js faz a maior parte do trabalho para você, semelhante ao método Ajax, que faz muito menos código. Além disso, usando soapclient.js eu sou capaz de fazer a chamada SOAP e também obter dados de volta a resposta formatada XML.

http://javascriptsoapclient.codeplex.com

Meu problema é que estou tentando usar o AngularJS para despejar a resposta XML em um objeto modelo AnularJS. Eu não tenho certeza de como configurar o projeto AngularJS para o que estou fazendo, mas eu realmente gostaria de saber o melhor método para manter o que eu estou trabalhando em desacoplado. Eu tenho procurado o Google como um louco, mas a maioria dos exemplos parece muito complicada para um iniciante.

Aqui está o que eu tenho:

<html>
<head>
    <script language="JavaScript" type="text/javascript" src="jquery-1.10.1.js"></script>
    <script language="JavaScript" type="text/javascript" src="soapclient.js"></script>

    <script type="text/javascript">
        function getData() {
            var url2 = "https://myService";
            var pl = new SOAPClientParameters();

            pl.add("arg0", false);

            SOAPClient.invoke(url2, "methodToCall", pl, true, getDataCallback);
        }

        function getDataCallback(r, soapResponse) {
            alert(r.contents.payeeMailName);
        }
    </script>
</head>

<body>
<form>
    <input type="button" value="Click Here to Call Web Service" onClick="getData()" style="width: 192px">
</form>
<div id="result">Result?</div>
</body>
</html>

Agora, o serviço SOAP retorna os dados assim:

 <return>
    <contents>
       <eftAcctType>S</eftAcctType>
       <id>
          <djNumber>201-16-39063</djNumber>
          <djSequence>1</djSequence>
       </id>
       <payeeAddrLine1>124 Agate Drive</payeeAddrLine1>
    </contents>
    <contents>
       <eftAcctType/>
       <id>
          <djNumber>201-16-39201</djNumber>
          <djSequence>1</djSequence>
       </id>
       <payeeAddrLine1>c/o Kevin Martinez, Attorney at Law</payeeAddrLine1>
    </contents>
    <contents>
       <eftAcctType>C</eftAcctType>
       <id>
          <djNumber>201-16-38561</djNumber>
          <djSequence>1</djSequence>
       </id>
       <payeeAddrLine1>1360 South Highway 191</payeeAddrLine1>
    </contents>
    <status>0</status>
 </return>

Qual é a maneira "adequada" em AngularJS para fazer a chamada de serviço, assumindo que a maneira que eu fiz é ok, se não me avise da melhor maneira e, em seguida, no resultado, como percorrer os dados na resposta XML e analisá-lo em um objeto de modelo angular? Eu eventualmente quero usar esses dados em um DataGrid.

Qualquer ajuda será muito apreciada.