Base solution for your next web application
Open Closed

routing error #117


User avatar
0
ipekuni created

Hi, i am trying to create a new menu item but i get an error i cant figure out. here is my menu definition inside appnavigationprovider class:

.AddItem(new MenuItemDefinition(
                    PageNames.App.Forms.Root,
                    L("Forms"),
                    icon: "glyphicon glyphicon-wrench"
                    ).AddItem(new MenuItemDefinition(
                        PageNames.App.Forms.StudentRequest,
                        L("StudentRequest"),
                        url: "forms.studentrequest",
                        icon: "icon-briefcase",
                        requiredPermissionName: AppPermissions.Pages_Forms_StudentRequest
                        )
                    )
                )

and here is my routing in app.js

if (abp.auth.hasPermission('Pages.Forms.StudentRequest')) {
            $stateProvider.state('forms.studentrequest', {
                url: '/forms/studentrequest',
                templateUrl: '~/App/tenant/views/forms/studentrequest.cshtml',
                menu: 'Forms.StudentRequest'
            });
        }

and here is the error i get: Error: Could not resolve 'forms.studentrequest' from state ''

am i missing something here? thanks


6 Answer(s)
  • User Avatar
    0
    hikalkan created
    Support Team

    Hi,

    This is related to wrong AngularJs url-router configuration. You probably missed to add a parent state 'forms'. You should define it in order to create a child route 'forms.studentrequest'. Example two-level root:

    $stateProvider.state('host', {
                'abstract': true,
                url: '/host',
                template: '<div ui-view class="fade-in-up"></div>'
            });
    
            if (abp.auth.hasPermission('Pages.Tenants')) {
                $urlRouterProvider.otherwise("/host/tenants"); //Entrace page for the host
                $stateProvider.state('host.tenants', {
                    url: '/tenants',
                    templateUrl: '~/App/host/views/tenants/index.cshtml',
                    menu: 'Tenants'
                });
            }
    

    So, we define an abstract route as shown above.

    Also, you should define the permission (See <a class="postlink" href="http://www.aspnetzero.com/Documents/Developing-Step-By-Step#adding-a-new-page">http://www.aspnetzero.com/Documents/Dev ... a-new-page</a> for step-by-step menu/route/permission definitions).

  • User Avatar
    0
    ipekuni created

    I have the permissions all setup. Just didnt know i had to create an abstract parent route.

    thank you. -ulker

  • User Avatar
    0
    suchomski created

    Hi all first of all! :mrgreen:

    I've just ran into the same problem... Followed the step-by-step guide and tried to add a menu item... Everything seemed to be OK (like the guide said) but then after I clicked the freshly created menu item the "Could not resolve [...]" appeared.

    Get your guide straight, please ;) .

  • User Avatar
    0
    hikalkan created
    Support Team

    Hi @suchomski,

    Have you than resolved the issue, or shall I try to help :)

    Actually, I did not go to very detail on angular-ui routing, thinking it has a well documentation (<a class="postlink" href="https://github.com/angular-ui/ui-router/wiki">https://github.com/angular-ui/ui-router/wiki</a>) and looking at source codes may be enough :)

    Thanks.

  • User Avatar
    0
    suchomski created

    @hikalkan

    Yup, it is all good now. Thanks! Sorry for the much delayed answer.

  • User Avatar
    0
    dparizek created

    The tutorial here:

    <a class="postlink" href="https://aspnetzero.com/Documents/Developing-Step-By-Step">https://aspnetzero.com/Documents/Develo ... ep-By-Step</a>

    has you do these steps:

    1. create child routes to tenant parent route in app.js.
    $stateProvider.state('tenant', {
                'abstract': true,
                url: '/tenant',
                template: '<div ui-view class="fade-in-up"></div>'
            });
    
            $stateProvider.state('tenant.sop', {
                url: '/sop',
                templateUrl: '~/App/tenant/views/sop/index.cshtml'
            });
    
    1. Then under App/tenant/views you create a folder for index.js and index.cshtml.
    <div ng-controller="tenant.views.sop.index as vm">
        <div class="row margin-bottom-5">
            <div class="col-xs-12">
                <div class="page-head">
                    <div class="page-title">
                        <h1>
                            <span>@L("Sop")</span>
                        </h1>
                    </div>
                </div>
            </div>
        </div>
        <div class="portlet light">
            <div class="portlet-body">
    
                <p>SOP CONTENT COMES HERE!</p>
    
            </div>
        </div>
    </div>
    
    (function () {
        appModule.controller('tenant.views.sop.index', [
            '$scope',
            function ($scope) {
                var vm = this;
    
                $scope.$on('$viewContentLoaded', function () {
                    Metronic.initAjax();
                });
    
                //...
            }
        ]);
    })();
    
    1. You add entries for Localization to Core/Localization/MyProject/MyProject.xml.
    <text name="Sop" value="SOP" />
    
    1. Also must add a constant entry to App_Start/Navigation/PageNames.cs. [this part seems not mentioned in tutorial]
    public static class Tenant
                {
                    public const string Dashboard = "Dashboard.Tenant";
                    public const string QueryBuilder = "QueryBuilder.Tenant";
                    public const string Demo = "Demo.Tenant";
                    public const string Sop = "Sop.Tenant";
                    public const string Social = "Social.Tenant";
                    public const string Filer = "Filer.Tenant";
                    public const string Settings = "Administration.Settings.Tenant";
                }
    

    After all that I still get the error angular.js:13642 Error: Could not resolve 'tenant.sop' from state 'tenant.dashboard'

    and I had this problem before but fixed it before. But I cannot remember how I fixed ): There needs to be yet one more entry somewhere but not remembering where.. or I am still missing something??? or ???...??? Ideas?

    NEVERMIND - was browser caching (or maybe combo with clearing ABP caches) issue. Arrgh!