我需要用基于角度的应用程序显示一个简单的当前时间。所以尝试了一个演示。
在主体 onload 函数中执行该函数。
<body onload="startTime()">
function startTime() {
}
我不想在 javascript 函数中执行。 Onload 是一个 javascript 预定义函数，在 angular 中是否有像 ngload 这样的指令？需要为此编写自定义指令或
Nginit 的行为类似，或者我可以调用运行块内的函数意味着角度运行与 javascript onload 有什么区别？
如果使用 ng-init，需要一个控制器，没有控制器运行块可以执行角度功能。是否有任何其他选项可用于在加载的 Dom 上显示。
使用
ngAfterViewInit您可以通过从 angular/core 导入 ngAfterViewInit 作为生命周期钩子。
它的典型实现如下所示：
import { Component, AfterViewInit } from '@angular/core';
@Component({
selector: 'my-app',
templateUrl: './app.component.html',
styleUrls: [ './app.component.css' ]
})
export class AppComponent implements AfterViewInit {
public ngAfterViewInit() {
// Do the logic here
}
}
你可以使用angular的$window对象：
$window.onload = function(e) {
//your magic here
}
方法一
在视图初始化后使用
import { Component, AfterViewInit } from '@angular/core';
@Component({
selector: 'app-root',
templateUrl: './app.component.html',
styleUrls: [ './app.component.css' ]
})
export class AppComponent implements OnInit, AfterViewInit {
public ngAfterViewInit() {
// Do the logic here
}
}
方法二
使用路由器导航结束
NavigationEND是导航成功结束时触发的事件，取消订阅事件后页面加载满，订阅并执行函数。
import { Component, OnInit} from '@angular/core';
import { Router, NavigationEnd,} from '@angular/router';
@Component({
selector: 'app-root',
templateUrl: './app.component.html',
styleUrls: ['./app.component.scss'],
})
export class AppComponent implements OnInit{
constructor( private router: Router, ) { }
ngOnInit(): void {
this.router.events
.pipe(
filter((event) => event instanceof NavigationEnd),
takeUntil(this.unsubscribe$)
)
.subscribe((event) => {
this.siteTrafficData();
});
}
siteTrafficData() {
// Do the logic here
}
}