Failed to invoke a service from js file #2131

prahlad created 7 years ago

I tried to create a list page similar to the example in the sample like get Tasks, I did exactly similar way with different entity, not sure my dynamic web api service is not invoking from my js file. Here is the sample code. Not sure where I am going wrong. My Html file is loading with lists empty, do we need to have an y other settings apart from inheriting from IApplicationService? Please suggest me where I am missing, it is wasting time and making me feel wrong about this framework, this is an excellent framework which I liked the idea very well.

Js File

(function () { var app = angular.module('app');

var controllerId = 'sts.views.jobLocation.locationsList';
//var controllerId = 'locationsController';
app.controller(controllerId, [
     '$scope', '$location', 'abp.services.tasksystem.jobLocation',
     function ($scope, $location, jobLocationService) {
        var vm = this;

        //vm.localize = abp.localization.getSource('SimpleTaskSystem');

        vm.jobLocationList = [];

        $scope.selectedState = 0;
        
        vm.filter1 = "test";

        //$scope.$watch('selectedState', function (value) {
        //    vm.refreshJobLocations();
        //});

       // alert("I am here1");
        vm.refreshJobLocations();

        vm.refreshJobLocations = function () {
            abp.ui.setBusy( //Set whole page busy until getTasks complete
                null,
                jobLocationService.getLocs({}).success(function (data) {
                    vm.jobLocationList = data.jobLocationsList;
                })
            );
        };

        
        vm.getLocationsCountText = function () {
            return abp.utils.formatString(vm.localize('Xlocations'), vm.jobLocationList.length);
        };
    }
]);

})();

Cshtml <div class="panel panel-default" ng-controller="sts.views.jobLocation.locationsList as vm">

&lt;br /&gt;&lt;br /&gt;
&lt;div class=&quot;panel-heading&quot; style=&quot;position: relative;&quot;&gt;
    &lt;br /&gt;
    &lt;div class=&quot;row&quot;&gt;
        
        &lt;h3 class=&quot;panel-title col-xs-6&quot;&gt;
            TYest
        &lt;/h3&gt;


    &lt;/div&gt;
&lt;/div&gt;

&lt;ul class=&quot;list-group&quot; ng-repeat=&quot;jobloc in vm.jobLocationList&quot;&gt;
    &lt;div class=&quot;list-group-item&quot;&gt;
        &lt;span&gt;{{jobloc.JobLocationID}}&lt;/span&gt;
        &lt;span&gt;&nbsp;&nbsp;&nbsp;&nbsp;&lt;/span&gt;
        &lt;span&gt;{{jobloc.JobLocationName}}&lt;/span&gt;
    &lt;/div&gt;
&lt;/ul&gt;

</div>

-- Webapi service using System; using System.Collections.Generic; using System.Linq; using System.Text; using System.Threading.Tasks; using Abp.AutoMapper; using Abp.Application.Services; using Abp.Domain.Repositories; using SimpleTaskSystem.JobLocations.Dtos; using SimpleTaskSystem.JobLocations; using AutoMapper;

namespace SimpleTaskSystem.JobLocations { public class JobLocationAppService : ApplicationService,IJobLocationAppService {

    private readonly IRepository&lt;JobLocation&gt; _jobLocationRepository;


    public JobLocationAppService(IRepository&lt;JobLocation&gt; jobLocationRepository)
    {
        _jobLocationRepository = jobLocationRepository;
    }

    //public JobLocationAppService()
    //{
    //    //_jobLocationRepository = new IJobLocationRepository();
    //}

    /*
    private readonly IJobLocationRepository _jobLocationRepository;

    public JobLocationAppService(IJobLocationRepository jobLocationRepository)
    {
        _jobLocationRepository = jobLocationRepository;
    }
    */
    

    public void CreateJobLocation(JobLocationDto jobLocationDTO)
    {
        Logger.Info("Creating a JobLocation for input: " + jobLocationDTO);

        //if (null == jobLocationDTO)
        //    jobLocationDTO = new JobLocationDto();

        JobLocation jobLocation = new JobLocation {
            JobLocationID = jobLocationDTO.JobLocationID,
            JobLocationName = jobLocationDTO.JobLocationName,
            CreatedAt = DateTime.Now,
            CreatedBy = "PrahladTest"
        };

        _jobLocationRepository.Insert(jobLocation);
    }

    public GetJobLocationsOutput GetLocs(GetJobLocationInput input)
    {
        Logger.Info("GetJobLocations for filter " );

        List&lt;JobLocationDto&gt; jobLocationDtos = new List&lt;JobLocationDto&gt;();

        List&lt;JobLocation&gt; jobLocationsList = _jobLocationRepository.GetAll().ToList();

        jobLocationDtos = Mapper.Map&lt;List&lt;JobLocationDto&gt;>(jobLocationsList);


        return new GetJobLocationsOutput
        {
            JobLocationsList  = Mapper.Map&lt;List&lt;JobLocationDto&gt;>(jobLocationsList)
        };
        
    }
}

}

4 Answer(s)

0

ismcagdas created 7 years ago
Support Team

Hi,

Can you try to call your app service from Chrome's developer console ? You can write something like this "abp.services.tasksystem.jobLocation.getLocs({})" and check if you can see any request on Chrome's network tab.

You can also check Logs.txt file under your web project. There might be some exception.
0

prahlad created 7 years ago

That is the problem, I am unable to see anything in the logs, my page loads with whatever static content it has. Event I kept alert it comes until that point but never invokes service.
0

prahlad created 7 years ago

As per your earlier suggestion when I load URL in Chrome I am getting error like this for this

vm.refreshJobLocations is not a function

angular.js:11655TypeError: vm.refreshJobLocations is not a function at new <anonymous> (<a class="postlink" href="http://localhost:6247/App/Main/views/jobLocation/list.js:25:16">http://localhost:6247/App/Main/views/jo ... t.js:25:16</a>) at Object.e [as invoke] (<a class="postlink" href="http://localhost:6247/Scripts/angular.min.js:36:315">http://localhost:6247/Scripts/angular.min.js:36:315</a>) at w.instance (<a class="postlink" href="http://localhost:6247/Scripts/angular.min.js:75:516">http://localhost:6247/Scripts/angular.min.js:75:516</a>) at <a class="postlink" href="http://localhost:6247/Scripts/angular.min.js:59:18">http://localhost:6247/Scripts/angular.min.js:59:18</a> at r (<a class="postlink" href="http://localhost:6247/Scripts/angular.min.js:7:408">http://localhost:6247/Scripts/angular.min.js:7:408</a>) at B (<a class="postlink" href="http://localhost:6247/Scripts/angular.min.js:59:2">http://localhost:6247/Scripts/angular.min.js:59:2</a>) at g (<a class="postlink" href="http://localhost:6247/Scripts/angular.min.js:51:335">http://localhost:6247/Scripts/angular.min.js:51:335</a>) at <a class="postlink" href="http://localhost:6247/Scripts/angular.min.js:50:444">http://localhost:6247/Scripts/angular.min.js:50:444</a> at <a class="postlink" href="http://localhost:6247/Scripts/angular-ui-router.min.js:7:22912">http://localhost:6247/Scripts/angular-u ... js:7:22912</a> at $ (<a class="postlink" href="http://localhost:6247/Scripts/angular.min.js:70:197">http://localhost:6247/Scripts/angular.min.js:70:197</a>)
0

prahlad created 7 years ago

Fixed by changing line vm.refreshJobLocations();

After function declaration.

Have an answer to this question? Log in and write your answer.