I am new to angularjs. While learning I have created a test applicaton in which I created a ajax enabled WCF service and a test page with angularjs code. When using $http.get() the control does not reach the service method and error is displayed.
My angularjs test page is as below
<body>
<form id="form1" runat="server">
<div>
<div ng-app="myAngularJs" ng-controller="myCtrl">
</div>
</div>
</form>
</body>
It does not do anything just trying to reach the service. the controller is in js file as below
angular.module("myAngularJs", []).controller("myCtrl", function ($scope, $http) {
$http({
url: "http://localhost:17040/Service1.svc/getData",
method: "GET"
}).then(function (data) {
debugger;
console.log(data);
var parsed = JSON.parse(data.data.d);
});
});
I have created WCF service in same project by adding a new ajax enabled WCF service. Its code is as below
[OperationContract]
[WebGet(UriTemplate = "/getData/", ResponseFormat = WebMessageFormat.Json)]
public string getData()
{
ServiceReference.WcfServiceClient obj = new ServiceReference.WcfServiceClient();
string data = obj.getTestAjaxget();
return data;
}
My issue is the control never reaches the service but error is displayed in browser console as below Failed to load resource: the server responded with a status of 500 (Internal Server Error)
My web.config is as below
<configuration>
<system.web>
<compilation debug="true" targetFramework="4.0" />
</system.web>
<system.serviceModel>
<bindings>
<webHttpBinding>
<binding crossDomainScriptAccessEnabled="true" name=""></binding>
</webHttpBinding>
</bindings>
<behaviors>
<endpointBehaviors>
<behavior name="ServiceAPI.WcfServiceAspNetAjaxBehavior">
<enableWebScript />
</behavior>
<behavior name="testApplication.Service1AspNetAjaxBehavior">
<enableWebScript />
</behavior>
</endpointBehaviors>
<serviceBehaviors>
<behavior name="">
<serviceMetadata httpGetEnabled="true"/>
<serviceDebug includeExceptionDetailInFaults="true"/>
</behavior>
</serviceBehaviors>
</behaviors>
<serviceHostingEnvironment aspNetCompatibilityEnabled="true"
multipleSiteBindingsEnabled="true" />
<services>
<service name="testApplication.Service1">
<endpoint address="" behaviorConfiguration="testApplication.Service1AspNetAjaxBehavior"
binding="webHttpBinding" contract="testApplication.Service1" />
<endpoint address="mex" binding="mexHttpBinding" contract="IMetadataExchange"/>
</service>
</services>
<client>
<endpoint address="http://localhost:6168/WcfService.svc" behaviorConfiguration="ServiceAPI.WcfServiceAspNetAjaxBehavior"
binding="webHttpBinding" contract="ServiceReference.WcfService" />
</client>
</system.serviceModel>
<system.webServer>
<modules runAllManagedModulesForAllRequests="true"/>
</system.webServer>
</configuration>