当它是ui-sref的父级时，无法设置ui-sref-active的样式

Question

我一直在研究一个simle角度导航应用程序。 我已经完成了ui-sref-active和ui-sref的概念。根据我的理解，如果分配给元素的ui-sref将ui-sref-active分配给其父元素，则可以设置ui-sref-active的样式。我在这里试过一个玩家： http://plnkr.co/edit/EhOxCw8EeQhS5uTCQBR0?p=preview

参考上述链接，我想实现以下目标：

1. 当我悬停时，请关注或点击其中任何一个标签（li标签/父标签）。选项卡的背景颜色，图标和文本颜色应该更改。当盘旋或聚焦时，更改工作正常。但是当我选择选项卡时，更改不会反映出来（我想突出显示活动选项卡，更改背景颜色并设置图标和文本样式）。我该怎样做才能做到这一点。

2. 我想要更少的代码而不是css。这是我可以提出的代码。它适用于悬停和焦点。不适用于所选的选项卡或活动选项卡。请帮忙

   li {

    padding: 28px 5px 8px 0px;
    background: yellow
    .fa {
     font-size: 35px;
     color: blue
     }
     p {
         font-size: 18px;
        color: blue
     }
     a {
         text-decoration: none;
    }
     &:hover,
     &:focus,
     &:active {
          background-color: green;
         .fa {
             color: #fff;
         }
         p {
              color: #fff;
         }
         a {
             text-decoration: none;
         }
     }
   

   }