如何使用焦点和焦点与角4

我有一个名为recipe-list的组件使用ngFor创建的列表。所有项目均使用组件配方项目构建。我想在聚焦时改变特定项目的风格。如何使用焦点和焦点与角4

下面是HTML：

对于偏方用品 - >

<a 
    class="list-group-item clearfix" 
    (click)="onSelected()" 
    style="cursor: pointer;"> 
    <div class="pull-left"> 
     <h4 class="list-group-item-heading">{{ recipe.name }}</h4> 
     <p class="list-group-item-text">{{ recipe.description }}</p> 
    </div> 
    <span class="pull-right"> 
     <img src="{{ recipe.imagePath }}" alt="{{ recipe.name }}" class="img-responsive" style="max-height: 50px; border-radius: 50%; width: 60px; Height: 60px;"> 
    </span> 
</a>

的偏方列表 - >

<div class="row"> 
    <div class="col-xs-12"> 
    <button class="btn btn-success">New Recipe</button> 
    </div> 
</div> 
<hr> 
<div class="row"> 
    <div class="col-xs-12"> 
    <app-recipe-item 
    *ngFor="let recipeEl of recipes" 
    [recipe]="recipeEl"></app-recipe-item> 
    </div> 
</div>

我需要改变的颜色边框一个和唯一的焦点

来源

2017-08-01 Ruvalter

重点是指当它点击了吗？对？ –

对我来说是一个州。点击后，元素会保持焦点，直到您点击其他地方。 – Ruvalter

对不起，如果我误解了一些东西，但如果你想要改变被聚焦的元素的颜色边界，为什么不使用CSS？像'.element：focus'选择器？ –

要能够把重点的元素，你需要添加属性“tabindex”。

<a tabindex="0" ...>

之后，您可以使用伪类“：focus”对其进行设计。使用CSS。

来源

2017-08-01 08:37:05

非常感谢。我这样做，并把大纲没有在CSS类，现在一切正常工作。 – Ruvalter

如何使用焦点和焦点与角4

回答

相关问题