AngularJS显示的textarea的链接点击

Question

我有链接的数组：

$scope.links = [{ 
    URL: ''  
}]; 

我要让使用data-ng-repeat认为这些链接。

我该怎么做，以便当用户点击其下的任何链接将显示一个文本框？如果再次点击该文本框将消失？

因此，如果HTML是：

<div data-ng-repeat="link in links"> 
    <p> 
     <a data-ng-href="{{link.URL}}">{{link.URl}}</a> 
    <p> 
    // when link above is clicked, insert here textbox 
</div> 

Answer 1

你可以利用这ng-repeat创建每个项目范围的事实。 使用一个临时变量showHelpText，这是你如何实现它：

<div data-ng-repeat="link in links"> 
    <p> 
     <a data-ng-href="{{link.URL}}" data-ng-click="showHelpText=!showHelpText">{{link.URl}}</a> 
    <p> 
    // when link above is clicked, insert here textbox 
    <input type="text" data-ng-show="showHelpText"> 
</div> 

Answer 2

尝试的ngClick和ngIf组合：

<div data-ng-repeat="link in links"> 
    <p> 
     <a data-ng-href="{{link.URL}}" 
     data-ng-click="link.$open = !link.$open">{{link.URl}}</a> 
     <input type="text" data-ng-if="link.$open" /> 
    <p> 
</div>