更改使用按钮单击生成的Angular中的对象的属性

在项目中，我使用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总是被加载。

来源

2017-03-05 Thidasa Paranavitharana

你打算捕捉任何事件来改变高度吗？或者你想如何改变身高？ –

我需要在加载条形码后更改它的高度（需要更改JsBarcode的** height **属性）。假设我有输入类型编号，并且需要使用角度数据绑定功能根据给定的输入更改height属性的值。如何做呢？ –

尝试我给你的答案，可能工作@ Thidasa –

创建条形码时使用ng-class选项。根据条件你可以改变父div。还可以尝试设置条码高度100％，这将占用父div的全部空间，并相应地用ng-class更改父div高度。

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

来源

2017-03-05 09:50:28

但改变div高度并没有帮助。我试图通过改变包含条形码的div来改变条形码的高度。但即使div小于它，它也需要默认高度（100px）。我可以改变条形码高度的唯一方法是改变它的高度属性的值。 –

你可以让条码的高度100％然后尝试？ –

我通过在复选框中使用ng-checked添加条形码生成函数调用来解决此问题。感谢您的帮助 –

更改使用按钮单击生成的Angular中的对象的属性

回答

相关问题