效果:
import {Component,Input,OnInit} from "@angular/core"; const css = require('./horizontal.component.css'); @Component({ selector: 'custom-div-title',templateUrl: './horizontal.component.html',styles: [ css ] }) export class CustomDivTitleComponent { @Input() title: string = '默认标题'; @Input('title') set changeTitle(val: any) { this.title = val; } }
<div class="row custom-div-title"> <div class="col-xs-3"> <span>{{ title }}</span> </div> </div>
.custom-div-title { border-top: 5px solid #36a9e1; margin: 10px auto; } .custom-div-title > div { background-color: #36a9e1; color: whitesmoke; font-size: 20px; font-family: "Microsoft YaHei UI"; text-align: left; }原文链接:https://www.f2er.com/angularjs/148681.html