ボタンを押してからng-hideを押すと、ng-hide

Question

私は情報を表示するためにクリックしたテキストを持ち、再度クリックするとその情報を非表示にします。現在は表示されていますが、非表示にはなりません。

マイコード：

<td ng-click="format(x.Recipient)" ng-show="x.Recipient.Name"> 
    <a> 
     {{x.Recipient.Name}} 
    </a> 
    </td> 
    <td ng-hide="x.Recipient.Name"> 
     {{x.Recipient}} 
    </td> 

任意の提案ですか？感謝:)

フォローアップ：

は私のコントローラを投稿するように頼まれた：

angular.module('app') 
     .controller('QueryCtrl', ['$scope', 'dbCall', 'uuid', '$http', '$cookies', 
     function($scope, dbCall, uuid, $http, $cookies) { 

      $scope.results = []; 
      $scope.error = false; 
      $scope.formatted = ''; 
      $scope.LOCATION = ''; 
      $scope.processed = false; 
      $scope.delivered = false; 
      $scope.processedInfo = {}; 
      $cookies.put("ptLastPage", "/query"); 
      $scope.successCall = false; 

      $scope.format = function(recipient) { 
      $scope.formatted = recipient.Name + '\n' + recipient.Email_Address + 
       '\n' + recipient.Job_Title + 
       '\n' + recipient.Department + '\n' + recipient.Office; 
      }; 

      $scope.toRun = function(err, data) { 
      if (err) { 
       //console.log(err, err.stack); 
       $scope.results = false; 
       $scope.error = 'Could not connect to database'; 
       $scope.$apply(); 
      } else { 
       //console.log(data); 
       if (data.Items.length > 0) { 
       if (data.Items.length > 1) { 
        data.Items.forEach(function(item) { 
        if (item.Action === 'Processed') { 
         $scope.processed = true; 
        } else if (item.Action === 'Delivered') { 
         $scope.delivered = true; 
        } 
        }); 
        data.Items.forEach(function(item) { 
        if ($scope.delivered) { 
         $scope.results.push(item); 
        } else if (item.Action === 'Processed') { 
         $scope.processedInfo = item; 
        } else { 
         $scope.results.push(item); 
        } 
        }); 
       } else { 
        $scope.results = data.Items[0]; 
       } 
       $scope.error = false; 
       } else { 
       $scope.results = false; 
       $scope.error = 'Tracking Number not found'; 
       } 
       $scope.formatted = ''; 
       $scope.location = ''; 
       $scope.$apply(); 
      } 
      }; 
      $scope.getData = function() { 
      $scope.results = []; 
      $scope.processed = false; 
      $scope.delivered = false; 
      //$scope.location = ''; 
      $scope.processedInfo = {}; 
      var params = { 
       'IndexName': 'TrackingNumber-index', 
       'KeyConditionExpression': 'TrackingNumber = :t_num', 
       'ExpressionAttributeValues': { 
       ':t_num': $scope.trackingNumber 
       }, 
       'ScanIndexForward': false 
      }; 
      return dbCall('query', params, $scope.toRun); 
      }; 

      $scope.postEmail = function(err, data) { 
      if (err) { 
       //console.log(err, err.stack); 
      } else { 
       $http.get('file.json').success(function(res) { 
       var toSend = { 
        'fromEmail': res.fromEmail, 
        'toAddresses': [$scope.processedInfo.Recipient.Email_Address], 
        'subject': res.subject, 
        'message': 'You have a Package.' + 
        '\n' + 
        '\n' + 'Tracking Number: ' + $scope.processedInfo.TrackingNumber + 
        '\n' + 'Location:' + $scope.LOCATION + 
        '\n' + 'Time: ' + new Date().toLocaleString() + 
        '\n' + 'Delivered by User: ' + $scope.USERNAME 
       }; 
       //console.log(toSend); 
       $scope.successCall = true; 
       $http.post(
        'email', 
        toSend); 
       $scope.getData(); 
       }); 
      } 
      }; 

      $scope.deliver = function() { 
      var params = { 
       Item: { 
       TrackingNumber: $scope.processedInfo.TrackingNumber, 
       LoggedByUser: $scope.USERNAME, 
       Id: '' + uuid(), 
       DateAndTime: new Date().toLocaleString(), 
       Action: 'Delivered', 
       Location: $scope.LOCATION, 
       Recipient: $scope.processedInfo.Recipient, 
       Notes: 'none' 
       } 
      }; 
      return dbCall('putItem', params, $scope.postEmail); 
      }; 
     } 
    ]); 

Answer 1

あなたはRecipient上の別のプロパティを切り替えるとng-hideにバインドすることができます。したがって、クリックハンドラは新しいフィールドを単に切り替えるだけです。たとえば：

<td ng-hide="x.Recipient.isVisible"> 
    {{x.Recipient}} 
</td> 

、その後、あなたのクリックハンドラは、単に値を切り替えます：

HTML

<td ng-click="format(x.Recipient);toggleIsVisible(x.Recipient)" ng-show="x.Recipient.isVisible"> 

JS

$scope.toggleIsVisible = function(recipient) { 
    recipient.isVisible = recipient.isVisible ? false : true; 
};