I want to add link to the menu items which are called from the database dynamically using angularjs. Please check my code then only you will understand What im strugglinhg. There is no way to give it directly add links usning href oru using json , If i use json i'm not getting the menu items dynamically .
The way i want to get the menu list and contents are like this: 1. I want to get the menu items dynamically from the database(Using wordpress database of another site) so that whenever any new menu item is added it will automatically changed in my list. 2. Wanna add links(these links are also fetching from the database), to each items, dynamically. So far i have successfully completed fetching menu and submenus dynamically from the database and it is displaying without any error . Here I am showing my code , please check: // HTML// * <!DOCTYPE html>* *<html>* *<head>* *<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.6.9/angular.min.js"></script> * *<script type="text/javascript" src="<?php echo base_url();?>Assets/js/angular_app.js" ></script>* *<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>* *<script src="https://cdnjs.cloudflare.com/ajax/libs/angular-ui-router/0.2.15/angular-ui-router.js" >* *</script>* *<script * *type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/angularjs/1.4.0/angular-route.js"></script>* *<link rel="stylesheet" type="text/css" href="<?php echo base_url(); ?>Assets/css/angularmenu.css" /> * *</head>* *<div ng-app="menuApp">* *<div ng-controller="menuController">* * <div id="wrapper1" class="container">* * <div id="nav1">* * <div><span></span> </div>* * <ul>* * <li ng-repeat="menu in menus" ng-class="{'has-children': (menu.post_title ==='News')}" ng-click="changeClass(menu)" >* * <a>{{menu.post_title}}</a>* * <ul ng-if="menu && (menu.post_title ==='News')" ng-controller="subController">* * <li ng-repeat="submenu in submenus" class="has-children" ng-controller="subController">* * <a href="{{submenu.post_content}}">{{submenu.post_title}}<span ></span></a></a>* * <ul ng-if="submenu" ng-class="submenu.class">* * <li ng-repeat="subsubmenu in submenu.menus">* * <a href="#">{{subsubmenu.title}}</a>* * </li>* * </ul>* * </li>* * </ul>* * </li>* * </ul>* * </div>* * </div>* * </div>* * </body>* *// app.js//* * var app = angular.module('menuApp', []); app.controller("menuController", function($scope,$http) { var baseUrl = 'http://localhost:8080/samplepage/'; $http.get(baseUrl+'Home/getmenu').then(function(response) { console.log(response); $scope.menus = response.data;});}); app.controller("subController", function($scope,$http) { var baseUrl = 'http://localhost:8080/samplepage/'; $http.get(baseUrl+ 'Home/getsubmenu').then(function(response) { console.log(response); $scope.submenus = response.data; }); });// Result //[image: Capture.PNG]The problem is need to add links to all these menu items how is it possible using angularjs . I've searched for weeks already and don't seem to progress any further. Any suggestions will be greatly appreciated.* -- You received this message because you are subscribed to the Google Groups "Angular and AngularJS discussion" group. To unsubscribe from this group and stop receiving emails from it, send an email to [email protected]. To post to this group, send email to [email protected]. Visit this group at https://groups.google.com/group/angular. For more options, visit https://groups.google.com/d/optout.
