2017-03-05 1 views
0

프로젝트에서 JsBarcode 라이브러리를 사용하여 바코드를 생성했습니다. 여기서는 ng-click 지시문을 사용하여 바코드를 생성했습니다. 여기 각도 데이터 바인딩 기능을 사용하여 생성 된 바코드의 속성을 변경해야합니다. 나는 이해했지만 어쨌든 효과가 없었습니다. 마지막으로 동일한 기능에 데이터 바인딩을 추가 했으므로 버튼을 클릭하여 바코드를 업데이트해야합니다. 제발, 각도 데이터 바인딩 기능을 사용하여이 작업을 수행 할 수 있습니까? 버튼 클릭으로 생성 된 Angular 객체의 속성 변경

내가

난 그냥 바코드 후 높이을 변경해야
$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; 
     } 
    }; 

항상 CreateTable에서을 실행하지 않고로드 바코드를 생성하는 데 사용하는 스크립트의 일부입니다.

+0

높이를 변경하는 이벤트를 캡처 하시겠습니까? 또는 높이를 어떻게 바꾸고 싶습니까? –

+0

로드 된 후 바코드의 높이를 변경해야합니다 (JsBarcode의 ** height ** 속성을 변경해야 함). 입력 유형 번호가 있고 각도 데이터 바인딩 기능을 사용하여 주어진 입력에 따라 height 특성 값을 변경해야한다고 가정 해 보겠습니다. 어떻게 할 수 있습니까? –

+0

내가 할 수있는 답변을 시도하십시오 @ Thidasa –

답변

1

바코드를 만들 때 ng-class 옵션을 사용하십시오. 조건에 따라 상위 div를 변경할 수 있습니다. 또한 부모 div의 전체 공간을 차지하고 ng-class에 따라 부모 div 높이를 변경하는 바코드 높이를 100 %로 설정하십시오.

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

하지만 div 높이를 변경해도 도움이되지 않습니다. 바코드가 포함 된 div를 변경하여 바코드의 높이를 변경하려고했습니다. 그러나 div가 그보다 작더라도 기본 높이 (100px)를 사용합니다. 바코드의 높이를 변경할 수있는 유일한 방법은 높이 속성의 값을 변경하는 것입니다. –

+0

바코드 높이를 100 % 만들 수 있습니까? –

+1

ng-checked를 사용하여 체크 박스에 함수 호출을 생성하는 바코드를 추가하여이 문제를 해결했습니다. 어쨌든 도움에 감사드립니다. –

관련 문제