vorbei

Question

Ich habe ein ng-repeat meiner Meinung nach, und ich möchte das Objekt zu übergeben von meinem ng-repeat zu einer javascript Funktion, aber wenn ich versuche, es auf der Konsole angezeigt wird es gibt mir undefined.

Hier ist mein html:

<!-- Panel --> 
<div class="row"> 
    <div class="col-lg-12"> 
    <div class="panel panel-primary"> 
     <div class="panel-heading"> 
     {{card}} 
     </div> 
     <!-- /.panel-heading --> 
     <div class="panel-body"> 


     <div id="nvd3-container" class="md-card" style="overflow-x: auto" ng-if="dataloaded0"> 

      <md-card-content id="nvd3-scrollable-content" style="width: {{width}}px; height: 350px;"> 
      <md-tabs md-dynamic-height="" md-border-bottom=""> 
       <md-tab ng-repeat="pu in selectedKpi" label="{{pu.dprdProuNr}}"> 

       <md-content class="md-padding"> 
        <div class="row"> 
        <div class="col-md-6"> 
         {{pu.item1}} 
         {{pu.item2}} 
        </div> 
        </div> 
       </md-content> 
       </md-tab> 
      </md-tabs> 
      </md-card-content> 
     </div> 
     </div> 
     <!-- /.panel-body --> 
     <a href="" ng-click="footerLinkClicked(pu)"> 
     <div class="panel-footer"> 
      <span class="pull-left">Trend</span> 
      <span 
             class="pull-right"> 
      <i class="fa fa-arrow-circle-right"></i> 
      </span> 
      <div class="clearfix"></div> 
     </div> 
     </a> 
    </div> 
    </div> 
</div> 

<!-- /.panel --> 

Hier ist meine js-Datei, die undefined zurück:

angular.module('App') 
    .directive('KpiParameter', function() { 
     return { 
      restrict: 'E', 
      templateUrl: 'app/kpi/kpi-parameter/kpi-parameter.html', 

      scope: { 
       card: '=', 
       kpiParamCallback: '&', 
       selectedProductionUnit: '<' 

      }, 

      controller: function($scope, $rootScope, KpiChartFactory, $filter) { 


       console.log("!???????"); 
       console.log($scope.selectedProductionUnit); 


       $scope.$watch('selectedProductionUnit', function() { 
        console.log($scope.selectedProductionUnit); 
        console.log("Changed"); 
        KpiParamUpdated(); 
        $scope.kpiParamCallback({ 
         selectedProductionUnit: $scope.productionUnitDefault 
        }); 

       }, true); 


       function KpiParamUpdated() { 
        console.log("KPiParamUpdated"); 
        console.log($scope.selectedProductionUnit); 
        $scope.dataloaded0 = true; 


        KpiChartFactory.get({ pu: $scope.selectedProductionUnit }, function(data) { 
         $scope.selectedKpi = data; 
         console.log($scope.selectedKpi); 


         $rootScope.$broadcast('kpiParams', $scope.selectedKpi); 
        }); 

       } 


       $scope.footerLinkClicked = function(pu) { 

        console.log("parameters received :"); 
        console.log(pu); 


       } 


      }, 
      controllerAs: "KpiPCtrl" 
     }; 
    }); 

Haben Sie eine Idee, warum? Ich muss es auch in meiner js-Datei definieren?

Answer 1

Wie in der docs von AngularMaterial gefunden haben, können Sie nur erreichen, was Sie durch die Verwendung md-on-select

tun wollen Attribute

ParameterTypBeschreibung

• Etikett Zeichenfolge Optional Attribut einen einfachen Zeichenfolge als Register Etikett
• ng-disabled boolean angeben, wenn vorhanden und Ausdruck truthy, untauglich Registerkarte Auswahl auswertet.
• md-on-deselect Ausdruck Ausdruck, der ausgewertet werden soll, nachdem die Registerkarte deaktiviert wurde.
• md-on-select Ausdruck Der Ausdruck wird ausgewertet, nachdem die Registerkarte ausgewählt wurde.
• md-aktiv Boolean Wenn true, wird die aktive Registerkarte festgelegt. Hinweis: Es kann immer nur eine aktive Registerkarte vorhanden sein.

Hinweis: Dieses Ereignis unterscheidet sich geringfügig von ng-Klick, dass, wenn ein Reiter bereits ausgewählt und angeklickt, dann wird das Ereignis wird nicht ausgelöst.

Answer 2

Ihr Anruf an footerLinkClicked() hat keine Möglichkeit zu wissen, welche pu zu verwenden, es sei denn, Sie sagen ihm, welche zu verwenden. Und da es außerhalb Ihrer ng-repeat ist, gibt es keine allzu einfache Möglichkeit, das zu tun.

md-tabs hat ein Attribut namens md-selected, mit dem Sie den aktuell ausgewählten Index in einer Variablen speichern können. So davon aus, dass selectedKpi ist ein Array (oder Array-artig), können Sie dies tun:

<md-tabs md-dynamic-height="" md-border-bottom="" md-selected="selectedTab"> 

und diese:

<a href="" ng-click="footerLinkClicked(selectedKpi[selectedTab])"> 

und Sie sollten alle eingestellt werden.