Создание метода контроллера для категорий и подкатегорий

Я работаю над приложением, где у меня может быть список категорий как мой дом, а когда кто-то нажимает на параметр категории, отображается подкатегория списка. что я хочу, чтобы категории имели свой собственный .json-файл и подкатегорию списка со своим собственным. как бы этот контроллер выглядел, я очень новичок в angularjs, но люблю его так много. Пример Категория A имеет подкатегории 1a, 2a, 3a, 4a.Создание метода контроллера для категорий и подкатегорий

В любом случае помощь будет принята с благодарностью.

angular.module('starter', ['ionic', 'ionic-material',]) 

.run(function($ionicPlatform) { 
    $ionicPlatform.ready(function() { 
    // Hide the accessory bar by default (remove this to show the accessory bar above the keyboard 
    // for form inputs) 
    if(window.cordova && window.cordova.plugins.Keyboard) { 
     cordova.plugins.Keyboard.hideKeyboardAccessoryBar(true); 
    } 
    if(window.StatusBar) { 
     StatusBar.styleDefault(); 
    } 
    }); 
}) 

//states 
.config(function($stateProvider, $urlRouterProvider) { 
    $stateProvider 

    .state('app', { 
    url: '/app', 
    abstract: true, 
    templateUrl: 'templates/main.html', 
    controller: 'listController' 
    }) 

    .state('app.categories', { 
    url: '/categories', 
     templateUrl: 'templates/categories.html', 
     controller: 'listController' 
    }) 

    .state('app.itemList', { 
    url: '/itemList', 
     templateUrl: 'templates/itemList.html', 
     controller: 'restController' 
    }) 
    $urlRouterProvider.otherwise('/app/categories'); 
})

Так что это ниже мой контроллер для категорий, я надеялся, что, если есть способ, чтобы иметь другой контроллер для подкатегорий из другого файла .json

//controller for the categories 
.controller("listController", ['$scope','$http', function($scope, $http){ 
$http.get('js/data.json').success(function(data) { 
    $scope.cusines = data; 
    }); 
}]);

источник

2015-11-28 tsp

Насколько велик json? Возможно, стоит просто зарегистрировать этот тип данных с помощью 'value'' $ provider': https://docs.angularjs.org/guide/providers – lux

Вы можете иметь Подкатегории JSON для каждой категории.

Это working plunker.

app.js

// Ionic Starter App 

// angular.module is a global place for creating, registering and retrieving Angular modules 
// 'starter' is the name of this angular module example (also set in a <body> attribute in index.html) 
// the 2nd parameter is an array of 'requires' 
// 'starter.controllers' is found in controllers.js 
angular.module('starter', ['ionic', 'starter.controllers']) 

.run(function($ionicPlatform) { 
    $ionicPlatform.ready(function() { 
    // Hide the accessory bar by default (remove this to show the accessory bar above the keyboard 
    // for form inputs) 
    if (window.cordova && window.cordova.plugins.Keyboard) { 
     cordova.plugins.Keyboard.hideKeyboardAccessoryBar(true); 
     cordova.plugins.Keyboard.disableScroll(true); 

    } 
    if (window.StatusBar) { 
     // org.apache.cordova.statusbar required 
     StatusBar.styleDefault(); 
    } 
    }); 
}) 

.config(function($stateProvider, $urlRouterProvider) { 
    $stateProvider 

    .state('app', { 
    url: '/app', 
    abstract: true, 
    templateUrl: 'templates/menu.html', 
    controller: 'AppCtrl' 
    }) 

    .state('app.categories', { 
    url: '/categories', 
    views: { 
     'menuContent': { 
     templateUrl: 'templates/categories.html', 
     controller: 'listController' 
     } 
    } 
    }) 

    .state('app.subcategories', { 
    url: '/categories/:id', 
    views: { 
     'menuContent': { 
     templateUrl: 'templates/subcategories.html', 
     controller: 'subListController' 
     } 
    } 
    }) 

    .state('app.itemList', { 
    url: '/itemList', 
    templateUrl: 'templates/itemList.html', 
    controller: 'restController' 
    }) 
    $urlRouterProvider.otherwise('/app/categories'); 
});

controllers.js

angular.module('starter.controllers', []) 

.controller('AppCtrl', function($scope, $ionicModal, $timeout) { 
}) 

.controller("listController", ['$scope','$http', function($scope, $http){ 
    $http.get('js/data/data.json').success(function(data) { 
     $scope.categories = data; 
    }); 
}]) 

.controller('subListController', ['$scope', '$stateParams', '$http', function($scope, $stateParams, $http) { 
    console.log($stateParams.id); 
    $http.get('js/data/dataSub' + $stateParams.id + '.json').success(function(data) { 
     $scope.subCategories = data; 
    }); 
}]);

В subListController вы получите файл в формате JSON с динамическим именем ('dataSub' + CategoryId).

categories.html

<ion-view view-title="Categories"> 
    <ion-content> 
    <ion-list> 
     <ion-item ng-repeat="category in categories" href="#/app/categories/{{category.id}}"> 
     {{category.name}} 
     </ion-item> 
    </ion-list> 
    </ion-content> 
</ion-view>

subcategories.html

<ion-view view-title="Sub category"> 
    <ion-content> 
    <ion-list> 
     <ion-item ng-repeat="subCategory in subCategories"> 
     {{subCategory.name}} 
     </ion-item> 
    </ion-list> 
    </ion-content> 
</ion-view>

data.json

[ 
    { 
     "id": 1, 
     "name": "Category A" 
    }, 
    { 
     "id": 2, 
     "name": "Category 2" 
    }, 
    { 
     "id": 3, 
     "name": "Category 3" 
    }, 
    { 
     "id": 4, 
     "name": "Category 4" 
    } 
]

dataSub1.json

[ 
    { 
     "id": 1, 
     "name": "1a" 
    }, 
    { 
     "id": 2, 
     "name": "2a" 
    }, 
    { 
     "id": 3, 
     "name": "3a" 
    }, 
    { 
     "id": 4, 
     "name": "4a" 
    } 
]

источник

2015-12-10 11:46:49

Создание метода контроллера для категорий и подкатегорий

ответ

Смежные вопросы