小编Bod*_*ody的帖子

我正在使用@input从父组件接收属性,以便在子组件的元素之一中激活CSS类.

我可以从父母那里收到房产并激活班级.但这只能工作一次.我从父级接收的属性是一个类型的布尔数据,当我将它的状态设置为false来自子组件时,它在父级中不会改变.

Plunkr:https://plnkr.co/edit/58xuZ1uzvToPhPtOING2 ? p = preview

app.ts

import {Component, NgModule} from '@angular/core'
import {BrowserModule} from '@angular/platform-browser'
import { HeaderComponent } from './header';
import { SearchComponent } from './header/search';

@Component({
  selector: 'my-app',
  template: `
    <app-header></app-header>
  `,
})
export class App {
  name:string;
  constructor() {
  }
}

@NgModule({
  imports: [ BrowserModule ],
  declarations: [ App, HeaderComponent, SearchComponent ],
  bootstrap: [ App ]
})
export class AppModule {}

header.ts

import { Component, OnInit } from '@angular/core'; …

我正在尝试从服务变量(isSidebarVisible)获取更新的值,该变量值由另一个组件(header)通过click事件(toggleSidebar)继续更新.

sidebar.service.ts

import { Injectable } from '@angular/core';
import { Subject } from 'rxjs/Subject';

@Injectable() 
export class SidebarService {
    isSidebarVisible: boolean;

    sidebarVisibilityChange: Subject<boolean> = new Subject<boolean>();

    constructor()  {
        this.isSidebarVisible = false;
    }

    toggleSidebarVisibilty() {
        this.isSidebarVisible = !this.isSidebarVisible
        this.sidebarVisibilityChange.next(this.isSidebarVisible);
    }
}

sidebar.component.ts

export class SidebarComponent implements OnInit {
    asideVisible: boolean;
    _asideSubscription: any;

    constructor(private sidebarService: SidebarService) {
        this.asideVisible = sidebarService.isSidebarVisible
        this._asideSubscription = sidebarService.sidebarVisibilityChange.subscribe((value) => {
            this.asideVisible = value
        })
    }

    ngOnInit() {
    }
}

header.component.ts(更新服务变量的位置)

export …

当我尝试清除文本字段时,为什么此方法不起作用？

<div>
      <input type="text" placeholder="Search..." [value]="searchValue">
      <button (click)="clearSearch()">Clear</button>
</div>


export class App {
  searchValue:string = '';
  clearSearch() {
    this.searchValue = '';
  }
}

我期待的是:因为我正在传递搜索值的属性,当我单击按钮时,它应该获得在clearSearch()函数中处理的更新值.

我还注意到,如果我将默认值设置为searchValue,则clearSearch()函数有效,但只有一次.

请检查我的plunker.

我不能决定在下面的情况下使用哪种方法.点击按钮时我正在尝试提醒.我可以用2种方法做到这一点.哪个是最佳做法,请告诉我原因？

方法1

<div ng-app="app">
  <button alert>directive</button>
</div>

var app = angular.module('app', ['ngRoute']);

app
  .directive('alert', function(){
    return {

      link: function(scope, element, attr) {
            element.on('click', function(){
          alert('clicked');
        })
      }

    }
  })

方法2

<div ng-app="app" ng-controller="MainCtrl">
  <button ng-click="go()">ng-click</button>  
</div>

app.controller('MainCtrl', ['$scope', function($scope) {

  $scope.go = function() {
    alert('clicked');
  }
}]);

谢谢你,乳山

有没有办法在CSS或jQuery中编写基于font-family的条件字体大小？

而不是编写CSS代码,

.dark h1, 
.dark h2, 
.dark h3, 
.dark h4, 
.dark h5, 
.dark h6 {

}

有没有像[class*="blah"]这样的简短方法？

问候.

我的应用程序中有一些指令仅在某些组件中加载。目前与这些指令相关的所有样式都在 style.css 中全局定义。

有没有一种方法可以像我们在组件中所做的那样，为指令挂钩单独的样式 URL，而不是全局添加这些样式。

例如

@Directive ({
    selector: '[foobar]',
    styleUrls: [
       'foobar.directive.css'
    ]
})

我正在尝试使用ActivatedRoute. 我已经尝试了以下示例，并且能够获得我正在寻找的数据，但只能获得一次。在子路由更改期间，我没有看到更新的“布局”值。

路线

const routes: Routes = [
  {
    path: '',
    component: Layout1Component,
    children: [
      {
        path: '',
        redirectTo: 'home',
        pathMatch: 'full'
      },
      {
        path: 'home',
        loadChildren: './pages/analytics/analytics.module#AnalyticsModule',
        data: {
          layout: 'boxed'
        }
      },
      {
        path: 'files',
        loadChildren: './pages/files/files.module#FilesModule',
        data: {
          layout: 'full'
        }
      }
    ]
  }
];

布局1组件

export class Layout1Component implements OnInit {
  constructor(private service: AppService, route: ActivatedRoute) {
    this.layout = route.snapshot.firstChild.data['layout'];

    route.url.subscribe(() => {
      console.log(route.snapshot.firstChild.data['layout']);
    });
  }
}

我希望每次更改路线时都使用更新的“布局”值打印 console.log。

请帮我解决这个问题。

我有这些元素;

<div class="preview">
    <div class="title" style="display:block">
</div>

<div class="preview">
    <div class="title" style="display:none">
</div>

<div class="preview">
    <div class="title" style="display:none">
</div>

如果标题是'display:none',我想在预览中添加一个类.

请帮我简短一下.

感谢和问候.

我的代码是这样的,

<div class="sExample">
    <div class="child1 one">...</div>
    <div class="child2 one">...</div>

    <table>...</table>
    <div class="child3">...</div>
</div>

我想包括父DIV只为.child1和.child2目标类.one.我尝试了jQuery .wrap方法,但它为每个项目添加了父div.

请帮我这样做.