Question

我正在使用ACTIVITI并需要隐藏此按钮：

如果没有进程实例化，即服务器返回此（显示按钮）：

而不是这个（在这种情况下是按钮隐藏）：

这是我在HTML中使用的按钮的代码：

<div ng-controller=getDeploy>


            <h3>Deployments Info</h3>
            <br>
            <table class="table" table-bordered table-hover>
                <thead>
                    <tr>
                        <th>ID</th>
                        <th>Name</th>
                        <th>Deployment</th>
                        <th>Category</th>
                        <th class="text-center">Url</th>
                    </tr>
                </thead>
                <tbody>
                    <tr class="info" ng-repeat="x in names">
                        <td class="danger">{{ x.id }}</td>
                        <td>{{ x.name }}</td>
                        <td class="warning">{{ x.deploymentTime }}</td>
                        <td>{{ x.category }}</td>
                        <td>{{ x.url }}</td>
                    </tr>
                </tbody>
            </table>
        </div>
        <div style="width:200px; float:left;" ng-controller="InstanziateProcess">
            <button ng-click="processdef()">
                Instanzia il Processo
            </button>
        </div>

和JS：

function InstanziateProcess($scope, $http, Base64) {

$http.defaults.headers.common['Authorization'] = 'Basic ' + Base64.encode('kermit' + ':' + 'kermit');
$http.get("http://localhost:8080/activiti-rest/service/repository/process-definitions")
    .then(function (response, data, status, headers, config) {
        var key = response.data.data[0].key;


        var req = {
            method: 'POST',
            url: "http://localhost:8080/activiti-rest/service/runtime/process-instances",
            data: {
                processDefinitionKey: key
            },
            headers: {
                'Authorization': 'Basic ' + Base64.encode('kermit' + ':' + 'kermit'),
                'Accept': 'application/json',
                'Content-Type': 'application/json'
            }
        }

        $scope.processdef = function () {
            $http(req).then(function (response, data, status, headers, config) {
                console.log(response);
            });
        };
    });};

Answer 1

这将解决它

<button ng-click="processdef()" ng-show="YOUR_CONDITION_WHICH_CAN_BE_CONTROLLER_FUNCTION_RETURN_VALUE">

    Instanzia il Processo
</button>

注意：您应该在Angular中使用控制器作为语法:) NNB：您可能想要使用ng-if而不是ng-show - ng-if阻止HTML中包含的元素，ng-show包含HTML中的元素但只是通过自动添加隐藏来隐藏元素class / attribute

你的函数应该返回true或false。

Answer 2

如果我告诉你，当没有收到结果时，应该显示按钮？

<button ng-if="names.total==0" ng-click="processdef()">

然而，示例JSON，JS代码和HTML根本不适合。您在哪里分配给$scope.names，您用于ng-repeat的变量？

Answer 3

您可以使用ng-hide

 for(var i=0;i < data.length; i++)
                     {

                        new_array.push(data[i].catalog_name,data[i].price);
                        $("#print_receipt").append("<table><thead><tr><th>Item name</th><th>Unit Price</th></tr></thead><tbody><tr><td>");
                        for (var j=0;j < new_array.length; j++){


                            $.each(new_array[j], function( index, value ) {
                        $("#print_receipt").append("<table><tr><td>");
                          $("#print_receipt").append(value+"</td></tr></table>");
                          if(index == 1)
                          {
                              $("#print_receipt").append("</td></tr></tbody></table>");
                          }
                        });                         

                         }

       }

控制器中的

代码

<button ng-hide="bValue" ng-click="processdef()">
            Instanzia il Processo
</button>

Answer 4

$scope.bValue = false; $scope.processdef = function () { $http(req).then(function (response, data, status, headers, config) { $scope.bValue = false; if(response.data && response.data.data.length) // may change depends on response data $scope.bValue = true; }); };或ng-hide可能会满足您的需求。在您的范围内具有该按钮的角度控制器中，创建一个布尔变量，例如ng-show。然后，在HTML中添加processesAreRunning指令：

ng-show

其中显示“如果<button ng-click="processdef()" ng-show="myController.processesAreRunning"> Instanzia il Processo </button>为processesAreRunning，则显示此按钮”。显然用控制器的声明名称替换true。

有了这个逻辑，就像在HTTP请求完成后根据服务器返回给你的内容设置该变量一样简单。

如果您感到好奇，可以参考以下有关myController指令运作方式的更多文档：AngularJS: ngShow。

Angularjs - 如果元素不存在则隐藏元素

4 个答案: