Calling get-method from AngularJs controller #298

julian created 8 years ago

Hi!

I'm having difficulties with the get-method in AngularJs. I have followed the step-by-step guide, wich has been very good, but when I apply the instructions on my own project the results does'nt show and I have no idea what is wrong.

This is my js code:

(function () { appModule.controller('tenant.views.bet.index', [ '$scope', 'abp.services.app.tenantBetType', function ($scope, tenantBetTypeService) { var vm = this;

        $scope.$on('$viewContentLoaded', function () {
            Metronic.initAjax();
        });//this part doesnt exist in the tutorial but it does in the other views in my project so I just assumed it should be                 //there.

        vm.getBetTypes = [];

        tenantBetTypeService.getBetTypes({}).success(function (result) {
            vm.betTypes = result.items;
        });


        //...
    }
]);

And here is my cshtml code:

<div ng-controller="tenant.views.bet.index as vm"> <div class="row margin-bottom-5"> <div class="col-xs-6"> <div class="page-head"> <div class="page-title"> <h1> <span>@L("Bet")</span> </h1> </div> </div> </div> <div class="col-xs-6 text-right"> <button class="btn btn-primary blue" @ng-click="vm.doIt1()"@><i class="fa fa-plus"></i> ACTION_ONE</button> <button class="btn btn-primary blue" @ng-click="vm.doIt2()"@><i class="fa fa-plus"></i> ACTION_TWO</button> </div> </div> <div class="portlet light"> <div class="portlet-body"> <h3>@L("AllBetTypes")</h3>

        &lt;div class=&quot;list-group&quot;&gt;
            &lt;a href=&quot;javascript:;&quot; class=&quot;list-group-item&quot; ng-repeat=&quot;betType in vm.betTypes&quot;&gt;
                &lt;h4 class=&quot;list-group-item-heading&quot;&gt;
                    {{betType.BetTypeCode}} {{betType.BetTypeName}}  //the attributes i want to call
                &lt;/h4&gt;
            &lt;/a&gt;
        &lt;/div&gt;

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

</div>

5 Answer(s)

0
hikalkan created 8 years ago
Support Team
Hi,

Your controller and view seems fine at a first look. I sugges to make some ckecks to understand it better.

Open chrome' developer tools console if there is an error?

Open developer tool's network tab to see if a request made for getBetTypes method.

See logs in Web project's Logs folder if there is any error.

If you can't find the reason, you can also share your application service class and the application service

julian created 8 years ago

1: Here I get the following errors:

Error: [$injector:unpr] <a class="postlink" href="http://errors.angularjs.org/1.4.0/$injector/unpr?p0=abp.services.app.tenantBetTypeProvider%20%3C-%20abp.services.app.tenantBetType%20%3C-%20tenant.views.bet.index">http://errors.angularjs.org/1.4.0/$inje ... .bet.index</a> at Error (native) at <a class="postlink" href="http://localhost:6234/Scripts/angular.min.js:6:416">http://localhost:6234/Scripts/angular.min.js:6:416</a> at <a class="postlink" href="http://localhost:6234/Scripts/angular.min.js:40:204">http://localhost:6234/Scripts/angular.min.js:40:204</a> at Object.d [as get] (<a class="postlink" href="http://localhost:6234/Scripts/angular.min.js:38:175">http://localhost:6234/Scripts/angular.min.js:38:175</a>) at <a class="postlink" href="http://localhost:6234/Scripts/angular.min.js:40:278">http://localhost:6234/Scripts/angular.min.js:40:278</a> at d (<a class="postlink" href="http://localhost:6234/Scripts/angular.min.js:38:175">http://localhost:6234/Scripts/angular.min.js:38:175</a>) at Object.e [as invoke] (<a class="postlink" href="http://localhost:6234/Scripts/angular.min.js:38:445">http://localhost:6234/Scripts/angular.min.js:38:445</a>) at We.$get.Q.instance (<a class="postlink" href="http://localhost:6234/Scripts/angular.min.js:79:299">http://localhost:6234/Scripts/angular.min.js:79:299</a>) at M (<a class="postlink" href="http://localhost:6234/Scripts/angular.min.js:60:483">http://localhost:6234/Scripts/angular.min.js:60:483</a>) at g (<a class="postlink" href="http://localhost:6234/Scripts/angular.min.js:54:300">http://localhost:6234/Scripts/angular.min.js:54:300</a>) <div ui-view="" class="fade-in-up ng-scope">

2: Couldnt find any getBetType or anything like that in the Network tab.

3: Couldnt even find a log file...

BetTypeAppService:

class BetTypeAppService : ExpertspelServiceBase, IBetTypeAppService
    {
        private readonly IRepository<BetType> _betTypeRepository;

    public BetTypeAppService(IRepository<BetType> personRepository)
    {
        _betTypeRepository = personRepository;
    }

    public ListResultOutput<BetTypeListDto> GetBetTypes(GetBetTypeInput input)
    {
        var betType = _betTypeRepository
            .GetAll()
            .WhereIf(
                !(input.Filter==null),
                p => p.BetTypeCode.Contains(input.Filter) ||
                        p.BetTypeName.Contains(input.Filter)
            )
            .OrderBy(p => p.BetTypeCode)
            .ThenBy(p => p.BetTypeName)
            .ToList();

        return new ListResultOutput<BetTypeListDto>(betType.MapTo<List<BetTypeListDto>>());
    }

    }

And the get class

class GetBetTypeInput:IInputDto
    {
        public string Filter { get; set; }
    }

    [AutoMapFrom(typeof(BetType))]
    public class BetTypeListDto : FullAuditedEntityDto
    {
        public string BetTypeCode { get; set; }

        public string BetTypeName { get; set; }
    }

The interface for BetTypeAppService:

interface IBetTypeAppService : IApplicationService
    {
        ListResultOutput<BetTypeListDto> GetBetTypes(GetBetTypeInput input);
    }

And finally the AppServiceBase class:

public abstract class ExpertspelAppServiceBase : ApplicationService
    {
        public TenantManager TenantManager { get; set; }

        public UserManager UserManager { get; set; }

        protected ExpertspelAppServiceBase()
        {
            LocalizationSourceName = ExpertspelConsts.LocalizationSourceName;
        }

        protected virtual Task<User> GetCurrentUserAsync()
        {
            var user = UserManager.FindByIdAsync(AbpSession.GetUserId());
            if (user == null)
            {
                throw new ApplicationException("There is no current user!");
            }

            return user;
        }

        protected virtual User GetCurrentUser()
        {
            var user = UserManager.FindById(AbpSession.GetUserId());
            if (user == null)
            {
                throw new ApplicationException("There is no current user!");
            }

            return user;
        }

        protected virtual Task<Tenant> GetCurrentTenantAsync()
        {
            return TenantManager.GetByIdAsync(AbpSession.GetTenantId());
        }

        protected virtual Tenant GetCurrentTenant()
        {
            return TenantManager.GetById(AbpSession.GetTenantId());
        }

        protected virtual void CheckErrors(IdentityResult identityResult)
        {
            identityResult.CheckErrors(LocalizationManager);
        }
    }

Okey so when i read the summary in the base class I may have found out what I have done wrong, should I insert the getBetType method in the base class too?

0

julian created 8 years ago

Any Idea what could be the problem?

hikalkan created 8 years ago

Support Team

Hi,

Your application service name does not match with the injected service in the angular controller. True controller should be like that:

(function() {
    appModule.controller('tenant.views.bet.index', [
    '$scope', 'abp.services.app.betType',
    function($scope, betType) {
        var vm = this;

        $scope.$on('$viewContentLoaded', function() {
            Metronic.initAjax();
        }); //this part doesnt exist in the tutorial but it does in the other views in my project so I just assumed it should be //there.

        vm.getBetTypes = [];

        betType.getBetTypes({}).success(function(result) {
            vm.betTypes = result.items;
        });


        //...
    }
]);

So, 'abp.services.app.tenantBetType' should be 'abp.services.app.betType'. I thisk that you accidently add tenant prefix here.

Have a nice day.

0

hikalkan created 8 years ago
Support Team

Julian,

Since you have purchased AspNet Zero, you can ask urgent questions on the premium support forum: <a class="postlink-local" href="http://forum.aspnetboilerplate.com/viewforum.php?f=5">viewforum.php?f=5</a>

Note: But if your questions are not urgent, you can continue to ask in the community forum, so other developers can reply it.

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