Angular -变量在ngAfterViewInit之后被重置
Angular是一种流行的前端开发框架，用于构建单页应用程序。它使用TypeScript编写，并且具有强大的工具和功能，使开发人员能够快速构建高效、可扩展和可维护的应用程序。
在Angular中，ngAfterViewInit是一个生命周期钩子函数，它在组件的视图初始化之后被调用。在ngAfterViewInit之后，组件的视图已经被完全初始化，可以进行DOM操作和访问视图中的元素。
关于变量在ngAfterViewInit之后被重置的问题，可能是由于以下几个原因导致：
- 变量作用域问题：确保变量在正确的作用域内声明和使用。如果变量在ngAfterViewInit之外声明，它可能会在该函数内部被重置。
- 异步操作问题：如果变量的值是通过异步操作获取的，例如从服务器请求数据，那么在ngAfterViewInit之后才能获取到正确的值。在ngAfterViewInit之前，变量可能会被赋予初始值或undefined。
- 生命周期钩子问题：ngAfterViewInit是在组件视图初始化之后被调用的，但是如果变量的赋值逻辑在其他生命周期钩子函数中，可能会导致变量在ngAfterViewInit之后被重置。
解决这个问题的方法取决于具体的情况。以下是一些可能的解决方案：
- 将变量的声明和赋值逻辑放在ngAfterViewInit中，确保在视图初始化之后进行操作。
- 使用异步操作时，可以使用RxJS的Observable或Promise来确保在获取到数据后再进行相应的操作。
- 检查组件的其他生命周期钩子函数，确保变量的赋值逻辑没有在这些函数中。
总之，确保变量的声明、赋值和使用都在正确的时机和作用域内，可以避免变量在ngAfterViewInit之后被重置的问题。
关于Angular的更多信息和相关产品，您可以参考腾讯云的Angular介绍页面：Angular - 腾讯云
相关·内容
2回答
@Viewchild在ngOnInit期间未初始化
angular、typescript、angular-material、viewchild、ngoninit
我使用来自不同观察点的数据源在不同组件中运行两个MatTables。我的一个表排序功能工作得很好，但是在我的第二个表上，似乎在ngOnInit期间@ViewChild for MatSort没有初始化。
数据呈现，材料表有排序按钮，但功能为空。检查了我的导入和模块，一切正常。
在记录MatSort时，一个组件记录MatSort对象，另一个组件未定义
排序不起作用。
Feed.component：
import { PostService } from './../../services/post.service';
import { Post } from '
浏览 3提问于2019-07-10得票数 8
回答已采纳
1回答
使用带有动态数据的jquery插件来自angular4中的服务
jquery、angular
我最近使用了angular4，我想把代码代码从angular4中的滴答服务中获取，代码是
import { Injectable } from '@angular/core';
@Injectable()
export class TickerService {
constructor() { }
getTickerList()
{
return[{img:"../../assets/images/profile-pics.jpg",title:"Added New
Post-1
浏览 1提问于2017-09-20得票数 0
回答已采纳
1回答
如何设置角组件的动态"id“HTML属性？
javascript、angular、dependency-injection
我的问题与在同一页上放置具有不同参数的相同组件有关。在这种情况下，它是一个包含来自第三方Javascript库()的图表的组件，它需要一个HTML属性来定位和修改组件的id内容。
现在，这个id属性应该包含页面上的每个图表的唯一字符串，如果我直接将它设置为来自父组件的字符串，它就会运行得很好：
<my-chart id="gaugeChart0"></my-chart>
它工作的原因是我猜的，因为id属性在组件创建时就存在，而任何试图访问的代码都可以立即进行访问。
然而，此图表又嵌入到引导4卡布局中，如下所示：
<div class="ro
浏览 1提问于2018-08-20得票数 5
回答已采纳
2回答
如何使用<ng-模板>而不中断更改检测？
angular、ng-template
我试图通过修改标准的stackblitz.com " Hello“项目来学习如何使用ng-模板，以便使用ng-模板呈现Hello。不幸的是，它得到了一个讨厌的ExpressionChangedAfterItHasBeenCherredError。
先前的值：“名称:未定义的”。当前值：“名称:角”。该视图似乎是在其父视图和其子视图被脏检查后创建的。它是否在更改检测钩子中创建？
有人能解释一下吗?可以在没有错误的情况下完成？
@Component({
selector: 'my-app',
templateUrl: './app.component.htm
浏览 0提问于2018-12-24得票数 0
回答已采纳
1回答
角2:加载嵌套组件正在破坏ng2-烤面包的现有范围。
angular、toastr、angular-toastr
我在我的页面中使用了一个NG2-烤面包，并且工作正常，但是当我在页面中有一个嵌套组件时，现有的ng2-toastr(ToastManager)作用域被破坏了，而toastr无法工作。
constructor(public toastr: ToastsManager,public vcr: ViewContainerRef) {
this.toastr.setRootViewContainerRef(vcr);
}
在我打电话的时候
this.toastr.warning('Its Warning','Alert');
它可以正常工作，但在我加载其
浏览 2提问于2017-02-22得票数 0
2回答
this.paginatior未定义
angular、pagination
我正努力实现对席桌的分页.但是，当我控制台页面变量时，this.paginatior是未定义的。
import { MatPaginator, MatTableDataSource } from '@angular/material';
export class DataComponent implements OnInit{
public dataSource:MatTableDataSource<any>;
@ViewChild(MatPaginator, {static: true}) paginator: MatPaginator;
浏览 0提问于2019-09-05得票数 0
回答已采纳
2回答
为什么OnInit生命周期钩子不工作？
angular、typescript、web
为什么这个不起作用？？控制台总是给我一个类型错误；它不能读取属性排序。有人能帮我吗？‘’ import { Component, OnInit, Input } from '@angular/core';
import { Order } from 'src/app/models/order';
@Component({
selector: 'app-table',
templateUrl: './table.component.html',
styleUrls: ['./table.component.c
浏览 26提问于2020-04-29得票数 0
2回答
角画布未定义
javascript、angular、typescript、chart.js
我在离子角度应用程序中使用chart.js，得到了以下错误：
this.barCanvas is undefined
代码
HTML
<ion-card-content>
<canvas #barCanvas></canvas>
</ion-card-content>
Component
import { Component, OnInit, ElementRef, ViewChild } from '@angular/core';
import { Chart } from 'chart.js';
expo
浏览 2提问于2020-10-08得票数 0
回答已采纳
1回答
我在从<my-app>(角度2)的元素中插入元素时遇到问题。我首先需要得到元素<div class="render"></div>，我用<script>中的jQuery实现了这一点(查看代码html)，然后需要在<div class="render"></div>中写入任何信息(例如<h1> Hello </h1> (查看HTML代码) )。当应用程序运行时，然后代码必须将在<div class="render"></div>中
浏览 0提问于2016-09-07得票数 0
回答已采纳
4回答
Angular Error error TS2531:调用scrollIntoView时对象可能为'null‘
javascript、angular、dom
我在一个Angular项目中工作，我想通过id在Angular中创建一个滚动视图。我写了这个方法： ngOnInit() {
setTimeout(() => {
if (this.router.url.includes('contact')) {
let abc ;
abc= document.getElementById("contact")
abc.scrollIntoView();
}
if (this.router.url ==
浏览 58提问于2021-03-11得票数 0
回答已采纳
1回答
哪个Javascript事件表示Angular SPA已完成页面加载？
javascript、angular
使用Google Tag Manager和VWO，我正在为我们的Angular SPA注入变化，以实现增长黑客的目的。然而，在完全呈现给定的页面后，我遇到了触发我的更改Javascript的问题。
是否有一个或一组事件可靠地表明页面已完成加载，这也将在页面转换时触发？我希望在不依赖角度钩子的情况下实现这一点，而是纯粹作为客户端Javascript。
浏览 2提问于2020-07-29得票数 0
3回答
角分量SetTimeOut函数在角材DataTable中的应用
javascript、angular、angular-material、settimeout
在我现有的一个项目中，我正在浏览一个角码，并在代码片段下面找到了它。我们使用Angular material datatable在页面上呈现视图
export class Component implements OnInit,AfterViewInit{
private dataSource: MatTableDataSource<Product> = null;
@ViewChild(MatPaginator) paginator: MatPaginator;
columnsToDisplay = ['productId','produ
浏览 0提问于2018-09-24得票数 2
回答已采纳
1回答
从API检索组件数据源的数据
angular、typescript
我正在尝试使用一个名为pokeapi-js-wrapper的现有节点包从API中检索数据。我对Angular有点陌生，所以我不确定我是不是正确地处理了这个问题。我已经构建了如下服务(数据本身是占位符)。 import { Injectable } from '@angular/core';
import { Pokedex } from "pokeapi-js-wrapper";
import { Pokemon } from 'src/Pokemon';
@Injectable({
providedIn: 'root'
浏览 18提问于2020-08-24得票数 0
2回答
$postLink的角度2生命周期等效值是什么？
angularjs、angular、angular2-upgrade
我目前正在升级从Angular.JS (1.5)到角2+。我在$postLink中遇到了IComponentController方法，我正在试图找出在角2+中等效的生命周期挂钩是什么。
浏览 6提问于2017-08-04得票数 5
回答已采纳
4回答
ngAfterViewInit()中未定义ngOnInit()中的数据集
angular、typescript、firebase
我正在尝试从Firebase获取数据，并将其设置为类中的一个变量。我面临的问题是变量在ngAfterViewInit()中没有定义。
我知道它是在ngOnInit()中设置的。我已经阅读了Angular文档页面中的Angular生命周期方法和英雄之旅示例，以查看我是否正确地获取了数据，但它仍然无法解释这种奇怪的行为(至少对我来说是如此！)。
ngOnInit() {
this.http.get('https://xxxxxxxx-xxxxx.firebaseio.com/data.json').map(response => response.json())
浏览 2提问于2017-09-04得票数 4
2回答
如何在组件中使用ionViewDidLoad()？
angular、typescript、components、ionic3
你好，我在ionic 3上工作，我的数据存储在本地存储中。我想在组件中使用这些数据，但ionViewDidLoad (它在正常页面中工作得很好)在组件上不起作用，我得到了以下错误：
那么，还有其他的建议吗？
组件代码(offre.ts)：
import { Component, Input , Output } from '@angular/core';
import { AngularFireDatabase, FirebaseListObservable } from "angularfire2/database";
import { I
浏览 1提问于2017-08-09得票数 0
1回答
检查已加载的嵌套组件
angular
我想在组件及其嵌套组件完全加载到DOM中之后执行一个函数。
我已经尝试过angular的life cicle钩子和javascript的DomContentLoaded函数。但是它们中没有一个是嵌套组件的工作。
import { Component, OnInit } from '@angular/core';
@Component({
selector: 'app-my',
templateUrl: `
<div>
<app-nested-component></app-nested-compon
浏览 1提问于2019-01-11得票数 1
我在学习角质2。在角质2生命周期中
ngAfterContentInit -- Component content has been initialized
ngAfterContentChecked -- Component content has been Checked
ngAfterViewInit -- Component views are initialized
ngAfterViewChecked -- Component views have been checked
我不明白ngAfterContentInit Vs ngAfterContentChecked，ngAfte
浏览 4提问于2017-09-11得票数 38
回答已采纳
2回答
Angular -调用ngOnInit()时，ngIf*下的元素不会呈现
javascript、angular、angular-ng-if、ngoninit
我注意到，当我在ngIf*下有一些元素时，在ngOnInit()上，即使满足条件，这些元素也不存在。当ngIf*下的一个元素被渲染时(我需要在它上面调用一些函数)，我如何“捕捉”这个时刻呢？
浏览 11提问于2020-05-06得票数 0
5回答
如何在angular 2中再次调用ngAfterViewInit内部代码
javascript、angular、typescript、angularjs-directive
在我的angular组件中，我有ngAfterViewInit方法，它包含一些我想要在视图初始化后执行的语句，因为它包含一些DOM处理。
我的问题是，当某些参数发生变化时，我希望在ngAfterViewInit中运行代码。
浏览 0提问于2018-02-15得票数 4
扫码
添加站长 进交流群
领取专属 10元无门槛券
手把手带您无忧上云
相关资讯
热门标签
活动推荐
腾讯云开发者
