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

Question

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

0

Я работаю над приложением, где у меня может быть список категорий как мой дом, и когда кто-то нажимает на параметр категории, отображается подкатегория списка. что я хочу, чтобы категории имели свой собственный.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;
  });
}]);

tsp 29 нояб. 2015, в 01:30

Источник

0

Насколько большой JSON? Возможно, стоит просто зарегистрировать этот тип данных с помощью value $provider : docs.angularjs.org/guide/providers.
lux 29 нояб. 2015, в 01:57

Теги:

angularjs

json

ionic

1 ответ

Ещё вопросы

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

Davide Pastore · Answer 1 · 2015-12-10T09-57-00.000Z

У вас могут быть подкатегории json для каждой категории.

Это рабочий плункер.

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"
    }
]