当前位置: 首页 > 面试题库 >

何时使用AngularJS`$ onInit`生命周期挂钩

郎慎之
2023-03-14
问题内容

随着AngularJS V1.7的发布,已经不建议使用和取消预定义绑定的选项:

由于38f8c9,
指令绑定在构造函数中不再可用

迁移代码:

* 如果指定$compileProvider.preAssignBindingsEnabled(true),则需要首先迁移代码,以便将标志翻转到false。有关如何执行此操作的说明,请参见
“从1.5迁移到1.6”指南。之后,删除该$compileProvider.preAssignBindingsEnabled(true)语句。

— AngularJS开发人员指南-
迁移至V1.7-编译

由于bcd0d4的缘故,默认情况下在控制器实例上禁用了预分配绑定。
强烈建议迁移您的应用程序,使其不尽快依赖它。

依赖于存在的绑定的初始化逻辑应该放在控制器的$onInit()方法中,保证在分配了绑定 之后 总是调用该方法。

— AngularJS开发人员指南-从v1.5迁移到v1.6-$
compile

将代码移至$onInit生命周期挂钩的用例有哪些?什么时候才能将代码保留在控制器构造函数中?


问题答案:

当代码$onInit依赖于绑定时,必须在函数中移动代码,因为这些绑定this在构造函数中不可用。它们在组件类的实例化之后被分配。

示例:您具有如下状态定义:

$stateProvider.state("app", {
  url: "/",
  views: {
    "indexView": {
      component: "category"
    }
  },
  resolve: {
    myResolve: (someService) => {
      return someService.getData();
    }
  }
});

您可以myResolve像这样将结果绑定到组件:

export const CategoryComponent = {
  bindings: {
    myResolve: "<"
  },
  controller: Category
};

如果你现在退出this.myResolveconstructor$onInit你会看到这样的事情:

constructor() {
  console.log(this.myResolve); // <-- undefined
}

$onInit() {
  console.log(this.myResolve); // <-- result of your resolve
}

因此,您的构造函数应仅包含如下构造代码:

constructor() {
  this.myArray = [];
  this.myString = "";
}

每个特定于角度的初始化和绑定或依赖项用法都应在 $onInit



 类似资料:
  • 问题内容: 我是React / Redux的新手,状态有问题。 TrajectContainer.jsx 当reducer返回新状态时,组件将使用新数据重新呈现。 但是:如果删除componentWillReceiveProps函数,则render()函数将具有旧状态。 我检查了mapStateToProps中收到的数据,这是新的新状态。所以我不明白为什么我需要componentWillRecei

  • 问题内容: 我目前正在管理AngularJS开发项目。有传言说我们至少需要从当前的1.2升级到AngularJS 1.5。我提出的一项要求是,我必须提供1.5终止支持的证据,但是在有角度的网站上进行了多个小时的搜索和多次Google搜索后却找不到任何终止支持的信息。 关于何时不再为Angular v1.x开发安全补丁和错误修复程序,是否有官方评论? 问题答案: 根据Angular开发团队的说法,当

  • 注:本文档提供的生命周期指的是 Universal App 的生命周期,它依赖 rax-app 提供的 runApp方法。 App 级生命周期 launch  在 App 启动时触发 使用生命周期 你可以使用 rax-app 提供的 useAppLaunch 来注册 App 级别的生命周期。 示例: import { useAppLaunch } from 'rax-app'; useAppLa

  • 我们大致为WebAPplication设计了4个生命周期: 请求初始化其实就是从URL中解析提取出{module}, {action}, {method}; 然后再根据{module}, {action}, {method}找到对应的Controller文件; 然后再调用对应的{method},完了之后再发送响应。当然响应的过程中肯定是要顺带着解析下模板标签啦。 恩,这就完了,貌似感觉很简单啊。

  • 如下图. 可以看出,基本周期是: created mounted updated (update 可以理解成人肉手动操作触发) destroyed 上面步骤中的 1,3,4都是自动触发。 每个步骤都有对应的 beforeXyz方法 所以, 我们一般使用mounted 作为页面初始化时执行的方法

  • 概览 组件的生命周期分为三个阶段:挂载、渲染、卸载,下图展示了解组件在整个生命周期中所涉及到的方法调用、原型方法调用和状态变化。 挂载阶段 从组件实例被创建再到被插入根组件树中,所经历的操作如下: 初始化组件实例。 根据组件类型绑定对应的原型。 调用 proto->init() 原型方法。 标记组件需要刷新全部样式。 因父组件变为另外一个组件,触发 link 事件。 更新阶段 当组件被插入到根组件