Arū*_*kas 15 javascript angular
由于Angular 2.x是在体内引导的,我如何添加[class.fixed]="isFixed"body标签(在my-app之外)?
<html>
<head>
</head>
<body [class.fixed]="isFixed">
<my-app>Loading...</my-app>
</body>
</html>
Run Code Online (Sandbox Code Playgroud)
我的app组件看起来像
import {Component} from 'angular2/core';
import {CORE_DIRECTIVES} from 'angular2/common';
import {RouteConfig, ROUTER_DIRECTIVES, Router, Location} from 'angular2/router';
import {About} from './components/about/about';
import {Test} from './components/test/test';
@Component({
selector: 'my-app',
providers: [],
templateUrl: '/views/my-app.html',
directives: [ROUTER_DIRECTIVES, CORE_DIRECTIVES],
pipes: []
})
@RouteConfig([
{path: '/about', name: 'About', component: About, useAsDefault: true},
{path: '/test', name: 'Test', component: Test}
])
export class MyApp {
router: Router;
location: Location;
constructor(router: Router, location: Location) {
this.router = router;
this.location = location;
}
}
Run Code Online (Sandbox Code Playgroud)
Gün*_*uer 21
使用<body>作为应用程序组件工作正常,但您不能在<body>标记上使用绑定,因为它尝试将"isFixed"绑定到父级,并且没有父级.
请@HostBinding改用
@Component(
selector: 'body',
templateUrl: 'app_element.html'
)
class AppElement {
@HostBinding('class.fixed')
bool isFixed = true;
}
Run Code Online (Sandbox Code Playgroud)
这是Dart代码,但将其转换为TS应该不难.
另请参阅@HostBinding和@HostListener:它们做了什么以及它们用于什么?
如果不依赖于服务器端呈现或Web工作者,则可以始终使用纯JS来更新DOM.
或者你可以使用
document.body.classList.add('foo');
Run Code Online (Sandbox Code Playgroud)
| 归档时间: |
|
| 查看次数: |
11668 次 |
| 最近记录: |