2017-03-05 1 views
0

In einem Projekt habe ich die JsBarcode-Bibliothek verwendet, um Barcodes zu generieren. Hier habe ich die ng-click-Direktive benutzt, um den Barcode in eckig zu erzeugen. Hier muss ich die Eigenschaften des generierten Barcodes mithilfe der eckigen Datenbindungsfunktion ändern. Ich versuchte es in jeder Hinsicht, aber es hat nicht funktioniert. Schließlich habe ich die Datenbindungen der gleichen Funktion hinzugefügt und jetzt muss ich auf die Schaltfläche klicken, um den Barcode zu aktualisieren. Kann mir bitte jemand helfen, dies mit der eckigen Datenbindungsfunktion zu erreichen? Ändern Sie die Eigenschaft eines Objekts in Angular, das mit einem Klick erzeugt wurde.

Dies ist der Teil des Skripts, die ich verwende, um den Strichcode zu erzeugen

$scope.CreateTable = function(){ 
window.setTimeout(function() { 
      JsBarcode('#barcode', ProductDescription, { 
       //format: 'CODE39', 
       flat:true, 
       displayValue: false, 
       margin:0, 
       marginLeft: 20, 
       marginRight: 0, 
       marginTop: 0, 
       marginBottom: 0,    
       height: $scope.calculateHeight(), 
       width: (1 + ((((($scope.paperSelection/$scope.numberOfColumns)-60) - (31.5 + 9.9 * ($scope.ProductDescription.length)))/(3.5 + 1.1 * ($scope.ProductDescription.length))) - 1) * 0.1) 
      }); 
     }); 
} 

$scope.calculateHeight = function() { 
     if (($scope.showNameOnTop == undefined || $scope.showNameOnTop == false) && ($scope.showNameOnBottom == undefined || $scope.showNameOnBottom == false) && ($scope.showDetails == undefined || $scope.showDetails == false)) { 
      return $scope.heightOfSticker - 30; 
     } 
     else if (($scope.showNameOnTop == true && ($scope.showNameOnBottom == false || $scope.showNameOnBottom == undefined) && ($scope.showDetails == false || $scope.showDetails == undefined)) || ($scope.showNameOnBottom == true && ($scope.showNameOnTop == false || $scope.showNameOnTop == undefined) && ($scope.showDetails == false || $scope.showDetails == undefined)) || ($scope.showDetails == true && ($scope.showNameOnBottom == false || $scope.showNameOnBottom == undefined) && ($scope.showNameOnTop == false || $scope.showNameOnTop == undefined))) { 
      return $scope.heightOfSticker - 40; 
     } 
     else if (($scope.showNameOnTop == true && $scope.showNameOnBottom == true && ($scope.showDetails == undefined || $scope.showDetails == false)) || ($scope.showNameOnTop == true && $scope.showDetails == true && ($scope.showNameOnBottom == undefined || $scope.showNameOnBottom == false)) || ($scope.showNameOnBottom == true && $scope.showDetails == true && ($scope.showDetails == undefined || $scope.showDetails == false))) { 
      return $scope.heightOfSticker - 60; 
     } 
    }; 

Ich muß nur die Höhe ändern nach dem Barcode, ohne den Create immer geladen ist.

+0

planen Sie, jedes Ereignis zu erfassen, um die Höhe zu ändern? oder wie willst du die Höhe ändern? –

+0

Ich muss die Höhe des Barcodes nach dem Laden ändern (muss die ** Höhe ** Eigenschaft von JsBarcode ändern). Angenommen, ich habe eine Eingabetypnummer und muss den Wert der height-Eigenschaft entsprechend der angegebenen Eingabe mithilfe der eckigen Datenbindungsfunktion ändern. Wie kann es gemacht werden? –

+0

versuchen Sie mit der Antwort, die ich Ihnen gab, die vielleicht funktionieren @ Thidasa –

Antwort

1

Verwenden Sie die Option ng-class, wenn Sie Ihren Barcode erstellen. Abhängig von der Bedingung können Sie das Eltern-Div ändern. Versuchen Sie auch, die Barcode-Höhe auf 100% zu setzen, wodurch das gesamte div-Leerzeichen des übergeordneten div-Elements verwendet wird und die Höhe des übergeordneten div entsprechend mit ng-class geändert wird.

<p ng-class="{class1 : expression1, class2 : expression2}">Changing css value</p> 
+0

Aber das Ändern der div-Höhe hilft nicht. Ich habe versucht, die Höhe des Barcodes zu ändern, indem ich das div, das der Barcode enthält, ändere. Aber es nimmt die Standardhöhe (100px), obwohl das div weniger ist als es. Die einzige Möglichkeit, die Höhe des Barcodes zu ändern, besteht darin, den Wert der Eigenschaft height zu ändern. –

+0

könnten Sie die Höhe des Barcodes 100% dann versuchen? –

+1

Ich löste das Problem, indem ich Barcode-Generierung Funktionsaufruf in Kontrollkästchen mit ng-checked hinzufügen. Danke für die Hilfe trotzdem –

Verwandte Themen