2016-11-22 2 views
2

Я довольно новыми для JSON и пытаюсь извлечь массив с именем «шаги» и строка «шаг» в этом формате JSON получить запрос результат в angularJS:Как получить JSON массив из объекта

Payload

Payload.data

Однако, я не могу получить эту информацию, пытаясь следующее (которые дают неопределенное или ошибка):

payload.data.steps 
payload.data.steps[0].step 
payload.data[0].steps 

любой графический интерфейс танцевать будет оценено спасибо!

SOLVED Спасибо всем за ваши продуманные и исчерпывающие ответы. Я делал несколько ошибок, в том числе с асинхронными результатами http.get.

Для дальнейшего использования в моем services.js я передал запрос добраться до моего контроллера так:

var recipes = payload.data[0].steps; 

и в моем controller.js я удостоверился, чтобы он ждать вызова, чтобы вернуться (а не получив обещание), а затем сохранить его в объем:

RecipeDetails.getInstructions($scope.details.id).then(function(InstructionPayload){ 
     $scope.instructions = InstructionPayload; 

и в моей HTML-странице для отображения шагов по отдельности:

//Steps: 
<div ng-repeat="list in instructions track by $index"> 
<p>{{ list.step }}</p> 
+0

'payload.data [0] .steps' должно сработать. Может быть, вы можете разместить источник json на pastebin.com, чтобы я мог анализировать дальше? –

+0

Можете ли вы поделиться кодом с 'fiddle' или' plnkr'? –

+0

payload.data [0] .steps работает, когда я делаю это в файле services.js, а не в контроллере! Спасибо. – parynaz

ответ

0

Вот вам быстрый ход, надеюсь, что это поможет. При необходимости я всегда могу обновить.

function exampleController($scope) { 
 
    $scope.example = [{ 
 
    name: "", 
 
    steps: [{ 
 
     equipment: [], 
 
     ingredients: [], 
 
     number: 1, 
 
     step: 'Blah' 
 
    }] 
 
    }, { 
 
    name: "", 
 
    steps: [{ 
 
     equipment: [], 
 
     ingredients: [], 
 
     number: 2, 
 
     step: 'Bibbidi' 
 
    }] 
 
    }, { 
 
    name: "", 
 
    steps: [{ 
 
     equipment: [], 
 
     ingredients: [], 
 
     number: 3, 
 
     step: 'Bobbidi' 
 
    }] 
 
    }, { 
 
    name: "", 
 
    steps: [{ 
 
     equipment: [], 
 
     ingredients: [], 
 
     number: 4, 
 
     step: 'Boo' 
 
    }] 
 
    }]; 
 

 
    function extractSteps() { 
 
    $scope.stepArray = []; 
 
    $scope.example.forEach(function(step) { 
 
     if (step.steps && Array.isArray(step.steps)) { 
 
     step.steps.forEach(function(value, index) { 
 
      if (value && value.step) { 
 
      $scope.stepArray.push({ 
 
       'step': value.step 
 
      }) 
 
      } 
 
     }); 
 
     } 
 
    }); 
 
    } 
 
    extractSteps(); 
 
} 
 

 
angular 
 
    .module('app', []) 
 
    .controller('exampleController', exampleController);
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script> 
 
<div class="container-fluid" ng-app="app"> 
 
    <div class="container" ng-controller="exampleController"> 
 
    <div class="row" ng-repeat="(key, value) in example" ng-bind="value.steps[0].step"> 
 
    </div> 
 
    <div class="row" ng-repeat="value in stepArray"> 
 
     <pre>{{value | json}}</pre> 
 
    </div> 
 
    </div> 
 
</div>

0

Если у вас есть подчеркивание или lodash в вас приложения, вы можете цепь несколько вещей вместе, вот так:

_.chain(obj.data) // wrap the data so we can chain transformations 
    .map('steps') // gather all the steps arrays from the main array 
    .flatten() // smash them into a single array 
    .map('step') // grab all the step properties from those 
    .value() // return the value -> ["Blah", "Bibbidi", "Bobbidi", "Boo"] from alphapilgrim's example data 
Смежные вопросы