相关疑难解决方法(0)

我是Angular 4的新手,所以有人可以解释::ng-deepAngular 4中的使用方法和位置吗？

实际上我想从父组件覆盖子组件的一些CSS属性.IE11还支持吗？

我的Angular 2应用程序中有一些CSS规则,这些规则在各种组件中都很常见.显然,我不想将它们复制并粘贴到每个组件的样式中.我目前有2个想法:

1. 将常见的CSS规则放在静态CSS文件中,并使用index.html的head部分中的链接将其包含在内.
2. 将我的常用CSS规则放在一个或多个文件中,并将它们包含在@Component每个组件的装饰器中,例如 styleUrls: [ './myComponentStyle.css', '../common/common.css']

对我来说,第一种方法看起来并不那么棱角分明,但同时它确实可以工作并且易于实现.

第二个需要对每个组件进行一些工作,但允许更多地控制一个人使​​用的样式.它还允许我将我的常用样式组织成较小的样式表,并仅使用所需的样式表.

你喜欢这些解决方案还是第三个更好的解决方案？:)

Doc说:

不推荐使用阴影穿透后代组合器,并且正在从主要浏览器和工具中删除支持.因此,我们计划放弃Angular中的支持(对于/ deep /,>>>和:: ng-deep的所有3个).在此之前:: ng-deep应该是首选,以便与工具更广泛地兼容.

既然我想在不更改代码的情况下升级到新版本,那么什么是弃用方法的替代方案？

Angular2材料团队最近发布了MDDialog https://github.com/angular/material2/blob/master/src/lib/dialog/README.md

我想改变angular2材质对话框的外观和感觉.例如,要更改弹出容器的固定大小并使其可滚动,请更改背景颜色,以此类推.最好的方法是什么？有没有我可以玩的CSS？

我一直在阅读这个选择器,并得到相互矛盾的答案.

In:/ deep /和:: shadow在CSS选择器中的含义是什么？

我们看:

正如Joel H.在评论中指出的那样,Chrome已经弃用了/ deep/combinator,并且在IE中给出了语法错误.

在:https://github.com/Microsoft/vscode/issues/7002

我们看:

/深/不再存在,所以我认为我们不应该支持它.>>>是新版本,应该可以支持

但是,在Angular 2文档中:https://angular.io/docs/ts/latest/guide/component-styles.html

我们看:

/ deep/selector也有别名>>>.我们可以互换使用两者中的任何一个.

显然,相信Angular 2文档是明智的,但由于所有这些相互矛盾的信息,我有点犹豫不决.

事实上,在最新版本的Microsoft Visual Studio Code中,BOTH /deep/并>>>创建了错误,尽管它们都能正常工作,尽管有错误.

我的问题是双重的:

1. 是/深/这里留下来？我们是否有任何来源,报价或任何规范中的任何内容表明它将被采用？或者如果它已被正式弃用？

2. 我们可以在没有全部禁用语法检查的情况下在Visual Studio代码中抑制此错误吗？

我正在尝试创建一个简单的Angular4 Web应用程序,它将显示和X或O,具体取决于评级.我在我的网络应用程序中看不到X或O.

我的rating.component.ts文件中的CSS类不起作用.我的项目正在编译,因为我可以将文本添加到我的评级组件模板,它将显示在网页上,但我看不到想要呈现的CSS.

我的app组件:

import { Component } from '@angular/core';
@Component({
    selector: 'app-root',
    template: `
        <rating></rating>
     `,
  styleUrls: ['./app.component.css']
})

export class AppComponent {
}

我的评分:

import { Component } from '@angular/core';

@Component({ 
    selector: 'rating', 
    template: `                   
        <i class="star" 
        [class.star-empty-icon]="rating < 1" 
        [class.star-full-icon]="rating >= 1" 
        (click)="onClick(1)">
        </i>
        <i class="star" 
        [class.star-empty-icon]="rating < 2" 
        [class.star-full-icon]="rating >= 2" 
        (click)="onClick(2)">
        </i>
    `
})
export class RatingComponent{ 
    rating = 0; 
    onClick(ratingValue){ 
        this.rating = ratingValue; 
    } 
}

我的Css:

.star.star-full-icon{
    content:'X';
}
.star.star-empty-icon{
    content:'O';
}

我想使用组件的styleClass属性Togglebutton.正如另一篇文章所述,我认为通过以下方式直截了当:

styleClass="test"

在我的css文件中,我然后设置了一些属性,比如

.test { background: red; }

但这不起作用.与工作style是利用非常清楚[style]="{'background':'red'}"没有问题这一点.但是styleClass不起作用.这是组件.不知道怎么用styleClass？

我现在正在努力工作几个小时.我使用Material2,只是想改变进度条的颜色.我知道有那些主题(主要/重音/警告),但我希望我的进度条有一个cutom颜色(绿色).

我已经尝试了最奇怪的css组合......但没有努力.也许有人有同样的问题？

我使用git项目作为虚拟键盘(https://ngx-material-keyboard.github.io/demo/).我有一些问题要让它在450*250像素的小型设备上运行.

最后,如果我使用开发工具直接在Web浏览器上修改它,我会在css中找到必要的更改.

现在我必须找到改变来源的正确位置.

将使用angular2-material的overlay组件来显示键盘.

如果我在cdk-overlay-container中注释掉该位置,它的工作原理如下:

.cdk-overlay-container {
/* position: fixed; */
z-index: 1000;

}

但我无法从我的角度应用中覆盖这些.有什么建议？

更改截图

我想更改ng bootstrap分页组件的样式并使用/deep/Angular 6应用程序中的链接.以下代码工作正常,但控制台显示警告,代码已被弃用.

那么,我应该如何更改它以摆脱警告？

这是我目前使用的CSS代码:

ngb-pagination /deep/ .page-item.disabled .page-link{
    background: none;
  }

 ngb-pagination /deep/ .page-item.active .page-link {
    background-color: #223C61;
    &:focus, &:visited{
      outline: none;
      box-shadow: none;
    }
  }