Yönergede yalnızca ikinci nesneye erişme ve bir şablon oluşturma

Question

AngularJs'de yönergelerin nasıl çalıştığını anlamaya çalışıyorum, bu benim üzerinde çalıştığım nesnedir, ancak çok daha kolay nesnelerle düzenli alıştırmalardan çok daha karmaşıktır. yönetmek.

angular.module('AngularJsExercise.controllers', []). 
     controller('angularJsExerciseController', function($scope, angularJsServices) { 
      $scope.advisor = { 
         name : "TheTitle", 
         pages: [ 
          { 
           id: 1, 
           pageNum: 0, 
           pageText: "First Page", 
           questions: [ 
            { 
             id: 11, 
             questionText: "I am looking for a new printer for...", 
             questionType: "RADIO_BUTTONS", 
             mandatory: true 
            } 
           ] 
          }, 
          { 
           id: 2, 
           pageNum: 1, 
           pageText: "Second Page", 
           questions: [ 
            { 
             id: 22, 
             questionText: "Printer should have..", 
             questionType: "CHECKBOX", 
             mandatory: false 
            }, 
            { 
             id: 22, 
             questionText: "What color ?", 
             questionType: "CHECKBOX", 
             mandatory: false 
            } 
           ] 
          }, 
          { 
           id: 3, 
           pageNum: 2, 
           pageText: "Third Page", 
           questions: [ 
            { 
             id: 33, 
             questionText: "I am looking for a new printer for...", 
             questionType: "RADIO_BUTTONS", 
             mandatory: true 
            } 
           ] 
          }, 
          { 
           id: 4, 
           pageNum: 3, 
           pageText: "Fourth Page", 
           questions: [ 
            { 
             id: 44, 
             questionText: "Price range", 
             questionType: "SINGLE_SLIDER", 
             mandatory: false 
            }, 
            { 
             id: 444, 
             questionText: "Printer size", 
             questionType: "DOUBLE_SLIDER", 
             mandatory: false 
            } 
           ] 
          } 
         ] 
        }; 

Ben sadece nesnenin ikinci bölümü olan bir şablon yapmak istiyorum "sayfalar", ama aynı zamanda tek bir sayfa öğesini temsil gösterilecek/nasıl bana başlıktır ilk bölümü getiriyor Bu tür karmaşık nesnelerdeki tüm atributları ile? İşte benim yönergesi geçerli:

angular.module('AngularJsExercise.controllers') 
      .directive('advisorPage', function() { 
       return { 
        restrict: 'E', 
        scope:{ 
         data: '=' 
        }, 
        // template: "<h1>{{advisor.name}}</h1>", <-- I want this part to have all of the attributes of the second object to display. 
        controller: function($scope){ 
         console.log($scope.data); 
        }, 
        templateUrl: 'advisorPage.template' 
       }; 
      }); 

Ve İşte size bir sayfayı temsil ve döngüde kullanmak olacak bir direktif oluşturmak için gereken düzeltmek anlaşıldığı gibi son kısmı

angular.module('AngularJsExercise', [ 
     'AngularJsExercise.services', 
     'AngularJsExercise.controllers', 
     'AngularJsExercise.filters' 
    ]); 


<div ng-app="AngularJsExercise" ng-controller="angularJsExerciseController"> 
     <!-- display pages with questions --> 
     <div ng-repeat="adv in advisor"> 
      <advisor-page data='adv'> </advisor-page> 
     </div> 

     <!-- advisorPage directive template --> 
     <script type="text/ng-template" id="advisorPage.template"> 

     </script> 
    </div> 

Answer 1

bu.

<advisor-page page="page" ng-repeat="page in advisor.pages"> 
    <page-question question="question" ng-repeat="question in page.questions"></questions> 
</advisor-page> 

Daha sonra temsil etmek istediğiniz her varlık için birbirinin içine yuva direktiflerine ng-transclude kullanabilirsiniz. Yönerge, bir yönergeyi bir diğerine sarmak ve istediğiniz bilgileri görüntülemek için yönlendirebilirsiniz.