Простая загрузка данных в state из json?

Есть вот такой несложный механизм:
<aside>
    <ul ng-repeat="data in datas">
      <li ui-sref="detail({id:data.id})">{{data.name}}</li>
    </ul>
  </aside>
  <div class="main-container">
    <div class="chenge-container">
      <div ui-view></div>
    </div>
  </div>

myApp.config(function($stateProvider, $urlRouterProvider) {
    $urlRouterProvider.otherwise('/detail');
    $stateProvider
    .state('detail', {
      url: '/detail/:id',
      templateUrl: 'pages/detail.html',
      controller: 'DetailCtrl',
    })
});
myApp.controller('MainCtrl', function($scope, $http){
  $http.get("params.json").success(function(datas){
    $scope.datas = datas;
  })
});
myApp.controller('DetailCtrl', function($scope, $http, $stateParams){
  $http.get($stateParams.id".json").success(function(data){
    $scope.data = data;
  })
});

Здесь, при клике на пункт, во вьюхе вылазит соответственная информация. Но реализовано костылем - используется 1.json, 2.json .. и т.д, в которых содержится соответствующая информация. Вопрос: как вытаскивать это из одного params.json файла ?
[{
  "id":1,
  "name":"Moscow",
  "detail":"That's an awesome message"
},{
  "id":2,
  "name":"Amsterdam",
  "detail":"That's the best message ever"
},{
  "id":3,
  "name":"Tokio",
  "detail":"I'M THE ONLY ONE"
}]
  • Вопрос задан
  • 258 просмотров
Пригласить эксперта
Ответы на вопрос 2
Мне кажется, кроме как вытащить весь файл а потом нужное выбрать не выйдет.
Ответ написан
Комментировать
0X12eb
@0X12eb
1 вариант:
myApp.config(function ($stateProvider, $urlRouterProvider) {
    $urlRouterProvider.otherwise('/detail');
    $stateProvider
        .state('root', {
            url: '',
            resolve: {
                promiseDatas: function ($state, $http) {
                    return $http.get("params.json");
                }
            },
            controller: function ($state, promiseDatas) {
                var vm = this;
                vm.datas = promiseDatas.data;
                $state.current.data.datas = promiseDatas.data;
            },
            controllerAs: 'root'
            data: {
                datas: {}
            }
        })
        .state('detail', {
            parent: 'root',
            url: '/detail/:id',
            templateUrl: 'pages/detail.html',
            resolve: {
                promiseData: function ($state, $stateParams) {
                    return _.findWhere($state.current.data.datas, { id: $stateParams.id })
                }
            },
            controller: function (promiseData) {
                var vm = this;
                vm.data = promiseData;
            },
            controllerAs: 'detail'
        })
})

2 вариант: Использовать $state.go и передавать { item } напрямую потомку (не придется трогать всю коллекцию и фильтровать ее на наличие интересующего объекта).
3 вариант: Использовать родительский $scope, но от скоупа лучше воздержаться.
Ответ написан
Комментировать
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Похожие вопросы