小编Mui*_*rik的帖子

试图通过 CSS 强制换行 - 显示:块不起作用

我试图让一个 div 占据整行,并为下一个 div 强制换行,这通常可以通过display:block在第一个 css 中使用来实现div- 据我所知。但这对我不起作用。不知道我错过了什么。澄清一下,div我试图占据整行的是flags-right div类。现在它与photo显示在同一行,它左对齐。这是我的 HTML:

<div class="flags-right">
    <div class="red-circle"></div>
    <div class="blue-circle"></div>
    <div class="yellow-circle"></div>
</div>
<div class="photo"><img [src]="rkPhoto" alt="photo" /></div>
Run Code Online (Sandbox Code Playgroud)

这是我的 CSS:

  .flags-right {
      float: right;
      display: block
  }

  .photo {
    float: left;
    height: 4.563rem;
    width: 4.688rem;
    margin-right: 0.75rem;
}

.red-circle {
    width: 20px;
    height: 20px;
    float: left;
    margin-right: 4px;
    background: #f9646a;
    -moz-border-radius: 50px;
    -webkit-border-radius: 50px;
    border-radius: 50px;
  }
.blue-circle {
    width: 20px;
    height: 20px;
    float: …
Run Code Online (Sandbox Code Playgroud)

html css less

1
推荐指数
1
解决办法
3370
查看次数

使用Angular 2中的字符串插值生成电子邮件链接

在我的Angular 2应用程序中,我使用md-menu和md-icon-button显示带有电子邮件地址的弹出窗口.我希望弹出的电子邮件地址会在点击时实际触发用户的默认电子邮件设置.因为我通过字符串插值来提取数据,所以我还需要使用字符串插值生成这些电子邮件.这就是我现在拥有的:

<md-menu #emailMenu="mdMenu">
<button md-menu-item>{{record.email}}</button>
</md-menu>

<button md-icon-button [mdMenuTriggerFor]="emailMenu">
<md-icon>mail_outline</md-icon>
</button>
Run Code Online (Sandbox Code Playgroud)

在哪里看到{{record.email}},我需要在这里构建它,以便触发默认的电子邮件行为(基本上就像mailto:function).我如何在Angular 2中执行此操作?

我会这样做吗?

<button md-menu-item><a href="mailto:{{record.email}}"></a></button>
Run Code Online (Sandbox Code Playgroud)

或者有更好的方法吗?

javascript angular2-routing angular

1
推荐指数
1
解决办法
5670
查看次数

使用* ngFor遍历数组,同时还过滤特定属性

在我的Angular 2应用程序中,我想知道是否有一种方法可以遍历数组,同时还可以过滤*ngFor块中的某个属性。所以语法看起来像这样:

<ng-template *ngFor="let flag['completed === false'] of service.flags">
    <span class="standard-flag" 
        [class.hold-flag]="flag?.flagType === 'hold'">Flag
    </span>
</ng-template>
Run Code Online (Sandbox Code Playgroud)

因此,基本的逻辑是,对于数组中存在的每个对象(“ flag”是一个对象),将“ completed”属性设置为“ false”,则返回该值。而不是首先遍历数组,然后使用* ngIf进行进一步过滤,如果可以同时在* ngFor块中做这件事会很好(在我的特定情况下非常有用)。可能?

我之所以对这种构造特别感兴趣,是因为我只想返回“ completed”为“ false”的第一个值,并且可以使用* ngFor中的“ let i = index”来处理它。在这种情况下阻止。但是我不想返回所有标志对象中的第一个,只是返回“ completed”属性设置为“ false”的标志对象。

javascript arrays typescript angular-ng-if angular

1
推荐指数
1
解决办法
897
查看次数

在 Chrome 中选择“在新选项卡中打开链接”选项时,应用程序路由重定向到 Angular 应用程序中的登录

我在 Angular 2 应用程序中发现了一个问题,正在尝试解决该问题。目前,当我单击整个应用程序中的链接时,我的路由按预期工作。以下是如何在我的根路由文件中定义路由路径的示例:

{ path: 'home', component: HomeComponent, canActivate: [AuthGuard], data: {contentId: 'home-page'} },
{ path: 'contacts', component: ContactsComponent, canActivate: [AuthGuard], data: {contentId: 'contacts-page'} },
Run Code Online (Sandbox Code Playgroud)

但是,如果在单击链接以路由到应用程序中的不同组件时,如果我还右键单击鼠标并选择“在新选项卡中打开链接”,则会发生的情况是,当新选项卡打开时,不会加载正确的组件,页面重定向到登录。同样,只有当我在 Chrome 中选择“在新选项卡中打开链接”选项时才会发生这种情况。

我的登录组件的路由如下所示:

{ path: 'login', component: LoginComponent },
Run Code Online (Sandbox Code Playgroud)

为了进一步澄清,我在根路由文件中唯一的重定向逻辑是在无法识别路由时处理到 home 组件的重定向:

{ path: '**', redirectTo: 'home' }
Run Code Online (Sandbox Code Playgroud)

以下是“联系人”链接的示例 - 这是上面列出的路由之一: http://localhost:4200/contacts

这是默认浏览器的问题吗?这是默认的 Angular 问题吗?只是想知道我如何追踪这个问题并解决。

顺便说一句,我认为这可能是 AuthGuard 问题,但即使我从“联系人”链接中删除 AuthGuard 保护,在新选项卡中打开时仍然会重定向到登录组件。

这是我的登录组件的样子:

    constructor(private router: Router,
                private route: ActivatedRoute,
                private authenticationService: AuthenticationService,
                private alertService: AlertService,
                private idle: Idle)
    {}

    ngOnInit()
    {
        // reset login status …
Run Code Online (Sandbox Code Playgroud)

javascript routes typescript angular

1
推荐指数
1
解决办法
2515
查看次数

重命名 MongoDB 数组中的字段

我需要更新集合中的字段名称。问题在于相关字段位于数组内。所以我试图确定正确的方法。我尝试这样做来完成重命名“plans”数组中存在的字段::

db.customers.updateMany( {}, { $rename: { "plans" : { "subscriptionType": "membershipType" } } } );
Run Code Online (Sandbox Code Playgroud)

但这是行不通的。处理数组中字段的这种转换的正确方法是什么?

数据如下:

{
  _id: 123,
  prop1: value,
  prop2: value,
  prop3: value,
  plans: [
    subscriptionType: value,
    otherProp: value,
    otherProp: value
  ]
}
Run Code Online (Sandbox Code Playgroud)

mongodb

1
推荐指数
1
解决办法
3440
查看次数

角度材质中垫菜单的自定义样式背景颜色

我试图在我的 Angular 2 应用程序中覆盖一些 Material2 样式,但到目前为止我无法让它工作。具体来说,我想覆盖 md 菜单的背景颜色。这是我的 html 的样子:

<md-menu #menu="mdMenu" [overlapTrigger]="false" class="sub-drop-bg">
  <button md-menu-item routerLink="option-A" class="sub-drop-item">Option A</button>
...
</md-menu>
Run Code Online (Sandbox Code Playgroud)

这就是我尝试在 LESS/CSS 中添加的内容:

md-menu.sub-drop-bg /deep/ {
  background-color: #555 !important;
}
Run Code Online (Sandbox Code Playgroud)

到目前为止,这似乎没有效果。默认#fff背景颜色仍然显示为 md 菜单背景。

作为附加信息,当我将鼠标悬停在元素上并检查元素时,我看到默认mat-menu-content类的样式为白色背景,如下所示:

.mat-menu-content {
    background: #fff;
}
Run Code Online (Sandbox Code Playgroud)

我已经尝试将该类添加到我的组件 CSS 中,并使用它来覆盖背景颜色,但也无济于事。如果我在浏览器控制台中为该类“取消选择”该颜色,背景颜色就会消失(变为透明)。但是,正如我所说,在我重新加载时,添加该类并覆盖 CSS 中的颜色不会覆盖白色。

如何仅使用 CSS 来完成此操作?

javascript css less angular-material angular

0
推荐指数
1
解决办法
4514
查看次数

`agenda.js` 如何计算 `every()` 操作的时区

agenda.js在我的 Node 项目中使用它,由 MongoDB 数据库支持,来处理我们需要运行的批处理过程。这运作良好。不过,我确实有一个关于时区的问题。当我使用该every()操作时,它似乎接受作业名称和时间表。所以我一直在数据库中播种作业,如下所示:

  for (let job of dbJobs) {
    await agenda.every(schedule, job.name);
  }
Run Code Online (Sandbox Code Playgroud)

请注意,上面的内容schedule采用 cron 格式 - 00 05 * * 1-5

这有效。然而,据我所知,every()不接受 的争论repeatTimezone。那么在这些情况下它是如何计算时区的呢?

澄清一下,当我使用 添加作业后查看数据库中的文档时every(),该repeatTimezone属性存在,但其值设置为null

其他agenda操作(例如repeatEvery()确实接受时区参数,如下所示:

job.repeatEvery('0 6 * * *', {
  timezone: 'America/New_York'
});
Run Code Online (Sandbox Code Playgroud)

自从我使用 以来every(),我一直通过首先使用 播种数据库every(),然后运行 ​​MongoupdateMany()将 timzeone 显式添加到所有作业来管理此操作:

async function addTimezoneToJobs() {
  try {
    const …
Run Code Online (Sandbox Code Playgroud)

mongodb node.js agenda

0
推荐指数
1
解决办法
2106
查看次数