Angular使用
记录使用angular框架时候遇到的问题
looper.zhuo
编程从入门到放弃到挣扎到了解到熟悉到精通
展开
-
web 动态组件的实现
背景组件的模板不会永远是固定的。应用可能会需要在运行期间加载一些新的组件。比如:英雄管理局正在计划一个广告活动,要在广告条中显示一系列不同的广告。几个不同的小组可能会频繁加入新的广告组件。 再用只支持静态组件结构的模板显然是不现实的。你需要一种新的组件加载方式,它不需要在广告条组件的模板中引用固定的组件。先看看效果图:准备工作我们以angular为例来做一次尝试。首先我们抽象地...原创 2020-04-10 13:54:38 · 338 阅读 · 3 评论 -
Angular之辅助路由
辅助路由即我们在某些场景路由加载组件时,还需要加载另外一些只负责显示的组件,此时我们可以使用辅助路由定义组件<a [routerLink]="[{outlets:{primary:'test2',aux1:'consult'}}]" routerLinkActive="active">Test1</a><a [routerLink]="[{out...原创 2020-04-20 18:20:33 · 266 阅读 · 2 评论 -
Angular中集成Script脚本你还不会?看这篇就够了
背景: 最近在做angular项目时,需要集成一个控件,其中需要引入最新的js文件,所以我们要使用: <script src="https://cdn.staticfile.org/jquery/2.1.1/jquery.min.js"></script>像这样的方式,并需要写一些初始化的逻辑显示此控件。先看看效果:分析:angula...原创 2020-04-17 14:57:34 · 2208 阅读 · 6 评论 -
吐血整理Angular8父子组件通信
背景:最近在做前端angular项目时遇到父子组件通信的问题,通常父子组件通信的方式有很多,有@input,@output,@viewchild等,接下来做一些总结如下:@input:@input装饰器通常用来父组件向子组件绑定时使用,用法也比较简单:(1)通过@input装饰器直接使用:父组件:<input [(ngModel)]="input"/>&l...原创 2019-12-27 17:20:18 · 624 阅读 · 2 评论 -
自定义angular中的Directive
背景:我们在一些组件或者component使用时想实现一些动态显示效果,比如鼠标移动上去或者一些其他事件,使用directive就可以很清晰的实现我们想要的效果。1.创建一个指令使用ng g directivexxx构建一个directive指令,该指令在app下,我们也可以创建一个文件夹把我们的directive.ts放在里面。不过别忘了导入我们的指令class@NgModul...原创 2019-11-26 17:54:01 · 291 阅读 · 5 评论