Angular2：组件主机属性

@Component.host属性代表什么？Angular2：组件主机属性

主机 - 类属性的地图主办元素绑定事件，属性和属性。

我不太清楚它是干什么用的？

我摆出这个，以了解我最后一天卡住的东西代码。

的代码是：

@Component({ 
    selector: 'layout', 
    encapsulation: ViewEncapsulation.None, 
    templateUrl: './layout.template.html', 
    host: { 
    '[class.nav-static]' : 'config.state["nav-static"]', 
    '[class.chat-sidebar-opened]' : 'chatOpened', 
    '[class.app]' : 'true', 
    id: 'app' 
    } 
}) 
export class Layout {

来源

2016-12-15 Jordi

我加入类主机标签。

像以下：

组件

 
@Component({ 
    selector: 'mytag', 
    templateUrl: './layout.template.html', 
    host: { 
    'class' : 'myclass1 myclass2 myclass3' 
    } 
}) 
export class MyTagComponent {

查看代码

<mytag></mytag>
结果

<mytag class="myclass1 myclass2 myclass3"></mytag>

来源

2017-02-18 06:55:13

基于this文件，您的主机属性（[class.nav-static]，在您的代码段[class.chat-sidebar-opened]和[class.app]）内的指令属性应该每当其相应的表达式的值获得变化而变化。

例如，您的[class.nav-static]属性将获得'config.state["nav-static"]'表达式的值，并且每当表达式的值更新时它都会更新。

来源

2017-03-28 21:17:59

主机属性用于该事件的所有属性绑定到特定的类component.See我的代码，这会帮助你，因为我想专注于我的组件和重点出来的时候没有用

host: { 
    '(window:blur)': 'focusOutFunction($event)', 
    '(window:focus)': 'focusInFunction($event)', 
    }

这个focusOutFunction是活跃的当窗口模糊，我绑定了(window:blur)事件和focusInFunction它绑定了(window:focus)事件。它适用于我在该类组件中声明的所有属性。希望这可以帮助您了解

来源

2017-12-22 07:32:32

Angular2：组件主机属性

回答

相关问题