2016-06-05 26 views
3

Ich habe eine einfache Angular.js App, die ocLazyLoad zum Laden der Anwendungsdateien verwendet. Ich verwende das Skelett der sbAdminApp-Vorlage.ng-click Event funktioniert nicht mit ocLazyLoad

Mein Problem ist, dass wenn ich eine Vorlage mit einem ng-Click-Ereignis verwenden, das Click-Ereignis nicht ausgelöst wird. Es ist kein Problem mit dem Oszilloskop, denn wenn ich den Inhalt der Funktion auf die Ansicht drucke, wird sie angezeigt.

Hier einige meiner Code:

Für die Dateien ocLazyLoad Laden mit:

$stateProvider.state('dashboard.importLotteries', { 
    templateUrl: '/Scripts/app/views/importLotteries.html', 
    url: '/importLotteries', 
    controller: 'LotteriesCtrl', 
    resolve: { 
     loadMyFiles: function ($ocLazyLoad) { 
      return $ocLazyLoad.load({ 
       name: 'sbAdminApp', 
       files: [ 
        '/Scripts/app/scripts/services/lotteriesService.js', 
        '/Scripts/app/scripts/controllers/lotteries.js' 

       ] 
      }) 
     } 
    } 
} 

Dies ist die importLotteries.html Template-Datei:

<!-- /.row --> 
<div class="row"> 
    <div class="col-lg-12"> 
     <div class="panel panel-default"> 
      <div class="panel-heading"> 
       Import Lotteries 
      </div> 
      {{importLotteries.toString()}} 
      <div class="panel-body"> 
       <input type="button" ng-click="importLotteries()" value="Import"/> 

       <span ng-model="importStatus"> 
       </span> 
      </div> 
     </div> 
      <!-- /.panel --> 
     </div> 
    <!-- /.col-lg-12 --> 
</div> 

und dies ist der Controller code:

'use strict'; 
angular.module('sbAdminApp') 
    .controller('LotteriesCtrl', function ($scope, lotteriesService) { 

     $scope.importLotteries = function() { 

      alert("importing"); 
      $scope.importStatus = "Loading..."; 
     }; 

    }); 

Die Ergebnisansicht sieht wie folgt aus:

enter image description here

So wie Sie sehen können, ist die Funktion existiert auf dem Rahmen, aber das Click-Ereignis wird nicht ausgelöst, und ich bekomme keine Fehler.

Ich habe versucht, für eine Lösung online für einige Zeit jetzt zu suchen und konnte einen nicht finden, so wird jede Hilfe sehr geschätzt werden!

Nach weiterer Untersuchung des Problems, sehe ich, dass die Ereignisfunktion (ImportLotteries) im Bereich nicht definiert ist, aber wenn ich den Wert in eine Zeichenfolge anstelle einer Funktion ändern, ist der Wert des Bereichs korrekt.

+0

@ HanletEscaño Nein sollte es nicht. Sie fügen nur ein Präfix hinzu, wenn Sie controllerAs-Syntax verwenden, was er nicht ist - und wahrscheinlich würden Sie es sowieso nicht als $ scope bezeichnen wollen. Shai, woher weißt du, dass es nicht feuert? Hast du einen Haltepunkt darin gesetzt? – matmo

+0

@Shai Woher weißt du, dass es ocLazyLoad Problem ist? Haben Sie versucht, die Dateien (lotteriesService.js, lotteries.js) früher zu laden, anstatt sie mit ocLoazyLoad zu laden? – Saad

+0

@matmo, ja ich habe einen Haltepunkt gesetzt und ich habe einen Alarmbefehl hinzugefügt, der nicht ausgeführt wird. –

Antwort

0

Versuchen Sie, eine ng-href oder href an den Link anzuhängen und es wird ausgelöst.

<input type="button" ng-click="importLotteries()" ng-href='#' value="Import"/> 

Quelle:

[1] Angular ng-click with call to a controller function not working

+1

Aber er verwendet nicht den Link, aber die Eingabe, sollte es nicht das href-Attribut oder ng-href haben –

Verwandte Themen