- 博客(10)
- 收藏
- 关注
RSS订阅原创 Angular 学习日记 10 - 自定义指令（2）
目的：想要给元素设置背景的颜色，使其更加具有互动性，如：当鼠标悬停在元素上时设置背景颜色，移开时清空。
2024-01-11 17:48:11
365
1
原创 Angular 学习日记 9 - 自定义指令
类型的渲染器，从‘angular/core’导入。renderer2 提供了很多用来处理DOM的辅助方法。指令：ng generate directive [指令路径/指令名] 或 [指令名]可以添加 --skip-tests 跳过生成测试文件，也可以手动删除测试文件。直接访问元素并不是一个好的习惯，在这里可以使用一个更好的工具。最后，在app.module.ts 中导入该指令和添加到。这里用到了其中的setStyle方法。目的：实现一个简单的设置背景的指令。首先创建一个文件，文件后缀为。
2024-01-11 14:52:00
544
1
原创 Angular 学习日记 - 8 - 生命周期（2）
被@ContentChild 修饰的属性直到 afterContentInit()时才会渲染出来。被@ViewChild 修饰的属性直到 afterViewInit()时才会渲染出来。
2023-12-27 14:51:11
385
1
原创 Angular 学习日记 - 7 - 生命周期
很容易发现，name的修改，并没有触发 element 的变动。时，可以写在类实现的后面，既可以方便他人知晓用了哪些生命周期方法，又可以用vscode自动补全来生成该方法，还可以防止拼错方法名。在该组件的基础上加入一个name属性，传入element.name 并用一个按钮来修改它的值。可以看到它们在DoCheck之后调用，这是合理的，因为它们在每个变更周期后调用。因为在开发模式下运行，Angular有一个额外的检测周期，所以这里调用了两次。为了能看到组件被销毁，预先给该组件添加了一个删除按钮。
2023-12-27 14:05:24
1127
1
原创 Angular 学习日记 - 6 - 组件通信
通过@input() 修饰子组件中的变量，并且在父组件中，通过()括号监听子组件传输过来的变量。通过@input() 修饰子组件中的变量，并且在父组件中，通过中括号接收父组件传进来的值。@Input() 括号中的参数用于重命名变量，如。
2023-12-22 17:36:36
463
原创 Angular 学习日记 - 5 - 数据绑定
无论花括号中填了什么，最后必须以某种方式返回一个字符串，或者很容易转换成字符串的东西，比如数字之类的。还有一个限制是不能写多行表达式，所以不能用if或者for结构等等，但是可以用三元表达式。$event 是时间绑定的一个重要参数，我们可以通过$event获取所绑定的元素。可以自动触发输入事件更新组件的值，另外，由于是双向绑定，也会同时更新元素的值。用例：可以在花括号中间调用一个方法，然后返回一个字符串。可以动态绑定一些HTML属性。可以简单使用字符串绑定替换插值。在括号内添加所绑定的方法。
2023-12-21 17:54:05
378
原创 Angular 学习日记 - 2 - 指令（Directive）
step 1:code如下：step 2: 添加指令处理逻辑//修改元素背景step3: 模块中声明指令的存在declarations: [AppComponent, HighlightDirective], // 视图中声明指令的引用})step 4： 应用指令step 1:code 如下：step 2: 定义元素逻辑) {}if (!step 3: 声明指令})step 4: 应用指令// TS。
2023-11-12 22:13:42
55
原创 Angular 学习日记 - 1
Angular是一个JavaScript 框架，它允许你创建反应式的单页应用程序 [Single-Page-Applications(SPAs)]。一个只有单个页面的应用程序，我们可以在这个项目的URL中进行导航，但实际上我们的页面永远不会改变。它仅仅是将我们服务器中的HTML和JS文件渲染到了这个页面中。它提供了一种响应性很高的用户体验。JS的每次页面变更，都要比访问服务器获取每个新页面所要渲染的内容要快得多。这种方式允许你创建的程序，无论样式还是感觉都十分像移动程序，因为它非常快。
2023-11-11 14:17:30
56
1
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人