如果你调用一个方法/函数在你的任何组件的HTML模板,做以下实验:添加一个console.log (“”)该方法内部。
然后,与您的应用程序通过点击,进入信息形式,等等。你将在你的控制台看到是这样的:
为什么会这样?角的变化检测每一次事件发生在浏览器中运行。区。js告诉角,“发生”当我们与一个角的应用程序进行交互。然后,角检查更新的组件树。在HTML模板,如果您正在使用方法的唯一途径角度看输出的方法改变了…又叫它。
因此,不推荐在HTML模板中使用的方法。这样做可能对性能造成负面影响。相反,使用绑定类属性如下:
之前:
后:
请注意,如果您需要调用一个方法/函数来执行一些格式,你应该创建一个定制的管。管道设计只有当他们的输入数据的变化,这意味着它们默认是最佳性能优化的。
你可以看一个例子在Stackblitz。我添加了一个console.log (“”)在我的定制管道只运行一次展示:
如果你使用角,你最有可能熟悉角网站:https://angular.io。
但是你知道你访问前一个框架的文档版本使用版本号为前缀,如https://第十四节.angular.io吗?
更好的是,你可以得到一个未来的一瞥https://下一个.angular.io或者看看当前发布候选版:https://钢筋混凝土.angular.io。
同时,网站的标题都有不同的颜色只要你不是在当前版本:
可是有时,文档不回答所有的问题,在这种情况下,我们只是一个点击远离访问源代码的特性:
我一遍又一遍地使用这些技巧我做准备课程角信号。这就是我能一睹未来的和准备释放角16之前几个通讯问题。
本周我们的运营商concatWith(新名称concat因为RxJS v7)。这个操作符需要任意数量的可见,订阅一个接一个,按顺序,然后返回值发出的第一个可观察到的,然后第二个,第三个,等等。
不像forkJoin可见,这些并行,concatWith运行一个接一个,等待前一个可观测的完成订阅下一个。
作为一个结果,concatWith可以使用时间:
角16现在可以!你可以看视频的快速摘要角团队(在不到7分钟)。
我们已经覆盖了很多在这个通讯的新特性:
TakeUntilDestroyed操作符自动化的取消订阅其他值得注意的功能包括:
ng生成@angular /核心:独立和创建一个新的独立的应用程序吴新,独立角团队发布了一个长博文高亮显示这些特性的更多细节。我将介绍更多的这些特征分别在接下来的几周,但现在,我会让你升级到最新版本与本教程。
作为覆盖几个通讯前,警卫路线是功能角15 +。角16删除警卫的支持类。
这是否意味着我们必须迁移手动守卫我们的老班?当然不是!角团队,和角CLI自动移除弃用接口当升级到16角如下:
然后,如果你想保持你的警卫类,可以使用一个helper函数调用mapToCanActivate:
当然,你也可以决定使用一个函数:
传递参数与角路线是一个频繁的任务。角16之前,我们必须注入ActivatedRoute服务和检索服务使用的参数快照或参数个数属性。
角16,我们可以得到这些值自动绑定到组件输入路由器使用以下配置:
如果你使用RouterModule.forRoot ()语法,然后使组件输入绑定是这样的:
RouterModule。forRoot(路线,{bindToComponentInputs:真正的});
代码语言:JavaScript(javascript)
根据文档,这个选项可以绑定所有键值数据路由到组件输入:静态或路由数据,解决路径参数矩阵参数,查询参数。
例如,假设我们有一个URL参数id,如果我们使组件输入绑定功能,那么我们需要在我们的组件是一个@Input装饰器接收值:
我喜欢这个选项是我们的组件不需要ActivatedRoute服务了,这意味着他们不必使用路由组件。相反,他们可以使用在其他场景传递的id是一个HTML属性,就像任何其他non-routed组件。因此,我们的组件更通用的,而不是与单个用例。
的@Input装饰中扮演着重要的角色在角框架这样的输入表示组件让我们调整使用的应用程序的性能onPush变化检测策略。
早在这个通讯,我们也谈到了如何输入合理的存在ngOnInit生命周期钩。
输入要成为更好的角16的需要输入时,将抛出一个编译时错误的输入组件/指令需要但没有设置:
语法也很容易记住。角16定于本周公布,我将发布更多的新功能,新版本所有星期长。
v16的主要特征角信号,所以我刚刚发布了一个简短的视频课程学习所有你需要知道的关于角信号仅仅9美元!