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

Question

在一个项目中，我使用了JsBarcode库来生成条码。这里我使用 ng-click 指令在 angular 中生成条形码。在这里，我需要使用 angular 数据绑定功能更改生成的条形码的属性。我尝试了所有我能理解的方法，但没有用。最后，我将数据绑定添加到相同的函数，现在我必须单击按钮来更新条形码。拜托，任何人都可以使用 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。

Answer 1

创建条形码时使用 ng-class 选项。根据条件，您可以更改父级 div。还可以尝试将条形码高度设置为 100%，这将占用父 div 的完整 space 并相应地使用 ng-class.[=12= 更改父 div 高度]

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

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

Change the property of a object in Angular which generated using a button click

javascript

barcode

angularjs

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

Change the property of a object in Angular which generated using a button click

javascript

barcode

angularjs

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