Angular2 NG-内容SCSS嵌套的风格和StyleUrls使用时不工作：主机

我建立它采用ng-content，我发现，当我使用:host >>>Angular2 NG-内容SCSS嵌套的风格和StyleUrls使用时不工作：主机

比如我不能使用嵌套SCSS或StylesUrl组件：

:host >>> .toolbar-brand{ 
    color: red; 
    font-weight: 500; 
    text-decoration: none; 
    font-size: 16px; 
    text-transform: uppercase; 
} 

:host >>> .nav-bar-menu-options.hlink, .nav-bar-menu-options.drop-down{ 
    font-weight: 500; 
    text-decoration: none; 
    position: relative; 
    top: -6px; 
    font-size: 16px; 
    text-transform: uppercase; 
    padding: 0 10px 0 10px; 

    &.has-divider { 
    border-right: 1px solid #b0bec5; 
    } 

} 

:host >>> .nav-bar-menu-options.hlink:hover { 
    text-decoration: underline; 
    cursor: pointer; 
} 
:host >>> .fill-remaining-space { 
    flex: 1 1 auto; 
} 
:host >>> .search-link { 
    cursor: pointer; 
} 

:host >>>.search-input-container{ 
    position:relative; 

    .search-link{ 
    position: absolute; 
    top: 3px; 
    left:30px; 
    } 
} 

:host >>> .my-input{ 
    border-left: 1px solid #b0bec5; 
    padding: 11px 75px 11px 60px; 
    background: transparent; 
    outline:none; 
    margin-left: 20px; 
    width: 100%; 
    &::placeholder { 

    } 
}

谁能告诉我为什么我的.has-divider &我嵌套.search-link不工作，也为什么当我把一个.scss文件中的内容，并使用styleUrls它不与:host工作。这个预期或可能错误

我理想的情况下希望能够仍然使用从嵌套SCSS和外部SCSS文件

来源

2016-11-07 jonnie

>>>是已知SASS引起的问题。使用，而不是/deep/

来源

2016-11-07 19:00:54

所以这解决了从文件中读取而不是在行中的问题，但似乎无法使用嵌套的样式仍然... – jonnie

其实它似乎按预期工作，如果我只是内部包装'：host/deep/{...}' – jonnie

Angular2 NG-内容SCSS嵌套的风格和StyleUrls使用时不工作：主机

回答

相关问题