How to Expand and make one of the LeptonX left menu item selected ? #7368

10 उत्तर (ओं)

• 

  0

  Anjali_Musmade बनाया था 8 days ago

  सहायता दल Support Team Member

  Hello,

  Are you expecting something like this -

  please let me know.

  thanks

  बचाना रद्द करना
• 

  0

  cangunaydin बनाया था 8 days ago

  Hello, yes exactly like that.

  बचाना रद्द करना
• 

  0

  Anjali_Musmade बनाया था 8 days ago

  सहायता दल Support Team Member

  Hello,

  For that you have to add your menuitems in MyApp\angular\src\app\route.provider.ts file just like I have done

  function configureRoutes(routes: RoutesService) {
    return () => {
      routes.add([
        {
          path: '/',
          name: '::Menu:Home',
          iconClass: 'fas fa-home',
          order: 1,
          layout: eLayoutType.application,
        },
        {
          path: '/dashboard',
          name: '::Menu:Dashboard',
          iconClass: 'fas fa-chart-line',
          order: 2,
          layout: eLayoutType.application,
          requiredPolicy: 'Ticket7368.Dashboard.Host  || Ticket7368.Dashboard.Tenant',
        },
        //I have added the below code you can customize it as per your requirement
        {
          path: '/book-store',
          name: '::Menu:BookStore',
          iconClass: 'fas fa-book',
          order: 101,
          layout: eLayoutType.application,
        },
        {
          path: '/books',
          name: '::Menu:Books',
          parentName: '::Menu:BookStore',
          layout: eLayoutType.application
        },
        {
          path: '/books1',
          name: '::Menu:Books1',
          parentName: '::Menu:BookStore',
          layout: eLayoutType.application
        },
        {
          path: '/books2',
          name: '::Menu:Books2',
          parentName: '::Menu:BookStore',
          layout: eLayoutType.application
        },
        {
          path: '/books3',
          name: '::Menu:Books3',
          parentName: '::Menu:BookStore',
          layout: eLayoutType.application
        }
      ]);
    };
  

  It results like

  Also, check this documentation for reference https://docs.abp.io/en/commercial/latest/tutorials/book-store/part-2?UI=NG&DB=EF#routing

  Thanks

  बचाना रद्द करना
• 

  0

  cangunaydin बनाया था 8 days ago

  Hello, Maybe you missed the points i am talking about, i want to change the menu item selection programmatically from typescript. Let's say i have another page "Books3 Update Page" For Ex which is not on the left menu items. I want Books3 to be selected when i load the page ("Books3 Update Page"). Can you do that programmatically when the "Books3 Update Page" is loaded.

  बचाना रद्द करना
• 

  0

  cangunaydin बनाया था 8 days ago

  or in your example can you add button to books3 page, and change the selected item to Books2 when the button is clicked.

  बचाना रद्द करना
• 

  0

  Anjali_Musmade बनाया था 8 days ago

  सहायता दल Support Team Member

  Hello,

  I have done something like shown in Video

  for that, I have created a button in Book3 and after clicking on it, it will redirect to Book2

   onBook2Click() {
         this.router.navigate(['/books2']);
      }
  

  Thanks

  बचाना रद्द करना
• 

  0

  cangunaydin बनाया था 7 days ago

  I think you totally understand this wrong. Without navigation, I want to achieve the same thing. You are navigating in your example.

  बचाना रद्द करना
• 

  0

  Anjali_Musmade बनाया था 7 days ago

  सहायता दल Support Team Member

  Hello,

  Sorry it's my bad. I apologise for your inconvenience. I will check again and get back to you asap.

  Thanks

  बचाना रद्द करना
• 

  0

  Anjali_Musmade बनाया था 7 days ago

  सहायता दल Support Team Member

  Hello,

  Please share some sample codes by mail at support@abp.io, and mention your ticket number in the mail. Then I can help you better.

  Thanks

  बचाना रद्द करना
• 

  0

  cangunaydin बनाया था 6 days ago

  I have prepared the sample app and sent it to the email address. you need to run postgres and redis inside docker container. To do that you can run the powershell file from aspnet-core/etc/docker/run-docker-sideapps.ps1 path.

  

  what i want to achieve, you can see it below. Also i write todo comment inside the project.

  Hope this will be enough.

  बचाना रद्द करना