8
का उपयोग करके दायरे में नेस्टेड मेनू आइटम तक पहुंचने के लिए मैं कोणीय के लिए काफी नया हूं और मेरे कोणीय ऐप में सबमेनू आइटम तक पहुंचने का कोई समाधान नहीं ढूंढ सकता। मैं शीर्ष स्तर मेनू आइटम का उपयोग कर सकते हैं, लेकिन कैसे दूसरे स्तर आइटमजेसन और angularJs
नीचेमेरी कोड अब तक है प्राप्त करने के लिए के रूप में खो गया हूँ
एचटीएमएल
<!DOCTYPE html>
<html>
<head>
<script src="http://ajax.googleapis.com/ajax/libs/angularjs/1.2.0-rc.3/angular.min.js"></script>
<script src="app.js"></script>
</head>
<body ng-app="list">
<div ng-controller="ListCtrl">
<ul>
<li ng-repeat="menu in menus" id="{{artist.id}}">
<a ng-href="{{menu.content}}">{{menu.description}}</a>
<ul>
<li ng-href="{{menu.content}}">{{menu.menu}}</li>
</ul>
</li>
</ul>
</div>
</html>
जावास्क्रिप्ट
// Code goes here
angular.module('list', []);
function ListCtrl($scope, $http) {
$http({
method: 'GET',
url: 'menu.json'
}).success(function(data) {
$scope.menus = data.menus; // response data
angular.forEach(data.menus, function(menu, index) {
});
});
}
जेसन
{
"menus":[
{
"id":"contact",
"leaf":true,
"description":"Contact Us",
"link":"",
"content":"contactUs.html",
"cssClass":"static-content",
"menu":null
},
{
"id":"rules",
"leaf":false,
"description":"Sports Betting Rules",
"link":"",
"content":"",
"cssClass":"",
"menu":[
{
"id":"types",
"leaf":true,
"description":"Wager Types",
"link":"",
"content":"wagerTypes.html",
"cssClass":"static-content wager-types",
"menu":null
},
{
"id":"odds",
"leaf":true,
"description":"Odds & Lines",
"link":"",
"content":"oddsAndLines.html",
"cssClass":"static-content",
"menu":null
},
{
"id":"policies",
"leaf":true,
"description":"Rules & Policies",
"link":"",
"content":"rulesAndPolicies.html",
"cssClass":"static-content rules-policies",
"menu":null
},
{
"id":"bonuses",
"leaf":true,
"description":"Sports Bonuses",
"link":"",
"content":"sportsBonuses.html",
"cssClass":"static-content",
"menu":null
}
]
},
{
"id":"conditions",
"leaf":false,
"description":"Terms & Conditions",
"link":"",
"content":"",
"cssClass":"",
"menu":[
{
"id":"termsOfService",
"leaf":true,
"description":"Terms of Service",
"link":"",
"content":"termsOfService.html",
"cssClass":"static-content",
"menu":null
},
{
"id":"privacy",
"leaf":true,
"description":"Privacy Policy",
"link":"",
"content":"privacy.html",
"cssClass":"static-content",
"menu":null
}
]
},
{
"id":"view",
"leaf":true,
"description":"View in: Mobile | Full Site",
"link":"",
"content":"view.html",
"cssClass":"static-content",
"menu":null
}
]
}
यह मेनू में 'ng-repeat = "submenu होना चाहिए .menu" ' – gzc
आपके अधिकार को खोलता है। बस इसे अद्यतन करें –