Question

所以基本上我要做的是修改属于父组件的元素的CSS。我有一个链接，一旦点击它路由到一个新的组件，这是一个弹出模式。我正在尝试将背景颜色，不透明度等应用于父组件。我怎样才能做到这一点？

Here is an example of what I am trying to achieve, click on the login button and you will see a popup appear and the background change.

登录组件

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

@Component({
    selector: 'login',
    templateUrl: './app/login/login.component.html',
    styleUrls: [ './app/login/login.component.css' ]
})

export class LoginComponent {}

路由到登录组件的主要组件

import { Component } from '@angular/core';
import { RouteConfig, ROUTER_DIRECTIVES } from '@angular/router-deprecated';

import { LoginComponent } from './login/login.component';

@Component({
    selector: 'main-component',
    templateUrl: './app/main.component.html',
    styleUrls: [ './app/main.component.css' ],
    directives: [ROUTER_DIRECTIVES]
})

@RouteConfig([
    {path: '/login', name: 'Login', component: LoginComponent}
])

export class MainComponent {}

main.component.html的html部分，其中包含路由到login.component.ts的链接。如何在这个样式表上使用css来表示从登录组件中执行z-index，opacity等？

<header>
    <h1>Budget Calculator</h1>
    <a id='login' [routerLink]="['Login']">Login</a>
    <router-outlet></router-outlet>
    <nav-bar></nav-bar>
</header>

使用css的样式父组件

0 个答案: