angular
改变自己2022
这个作者很懒,什么都没留下…
展开
-
angular动态加载子模块
模块化开发,懒加载。动态加载子模块配置。新建模块,带路由命令:ng g module/user --routing自定义模块下面的根组件创建命令:ng g component module/user其他组件创建命令:ng g component module/user/components/home子组件路由配置user-routing.modul...原创 2020-03-22 10:50:31 · 1012 阅读 · 0 评论 -
angular 自定义模块
模块化,组件化,更加方便项目的管理,开发1 创建新的项目.2 创建自定义模块命令:ng g module [pah/modulename]3 同理,可以在自定义模块下创建模块,包括根模块以及其他普通模块命令:ng g component [path/componentname]4 在user.module.ts中exports组件,外部模块才能使用import { N...原创 2020-03-22 09:35:47 · 294 阅读 · 0 评论 -
angular 路由
路由路由功能可以实现页面导航。效果如下:点击首页和商品可以分别路由到自己的信息页面首页下面的子组件 “欢迎” “设置” 点击之后也能路由。在右边展示信息。1新建项目选择需要使用路由2 配置路由app-routing.module.ts中2.1 import 组件2.2 在routes:[]里面配置路由import { NgModule } from...原创 2020-03-19 09:25:11 · 140 阅读 · 0 评论 -
angular 服务器交互get post jsonp
angular请求服务1.引入需要使用的模块2.构造入参调用模块的get和post方法代码:https://github.com/wp1993/personalCode/tree/682516abcb2583e792b89f80c48ae191fa7920f8/angularCodes/angular09/src/app效果:...原创 2020-03-17 14:14:01 · 105 阅读 · 0 评论 -
angular问题汇总
1.app.module.ts 基本理解? 模块基本定义://引入核心模块import { BrowserModule } from '@angular/platform-browser';import { NgModule } from '@angular/core';//引入其他的自定义模块import { AppComponent } from './app.componen...原创 2020-03-17 11:18:33 · 187 阅读 · 0 评论 -
angular 组件之间的通信
父子组件:1.父组件调用子组件时,绑定自定义属性赋值为父组件中的自定义变量。父组件通过该变量传递信息给子组件。父组件homesimport { Component, OnInit } from '@angular/core';@Component({ selector: 'app-homes', templateUrl: './homes.component.html',...原创 2020-03-15 15:05:18 · 172 阅读 · 0 评论 -
侧边栏实现--基于css3和angular JS
CSS3的transform属性:语法格式:transform:none|'transform-function'translate(x,y) 沿着x,y轴平移transition:all 2s; //2s 时间css代码: position: absolute; width: 200px; height: 100%; backgrou...原创 2020-03-13 16:11:58 · 93 阅读 · 0 评论 -
angular dom操作ViewChild
ViewChild操作dom1.给dom起名字<div #new01 id='new01' *ngIf="true"> 我是一个dom节点。</div>2.在业务逻辑里面引入ViewChild3.在类里面, @ViewChild()4 在生命周期函数中操作domngAfterInit(){ }//导入View...原创 2020-03-13 12:25:42 · 145 阅读 · 0 评论 -
angular 服务学习1
1 创建服务ng g service servicename //cli 创建服务1.1 服务开发import { Injectable } from '@angular/core';@Injectable({ providedIn: 'root'})export class StorageServiceService { constructor() { }...原创 2020-03-12 14:32:50 · 84 阅读 · 0 评论 -
angular 实现一个组件:搜索历史展示
1 新建angular 项目cmd 命令行模式下到项目路径执行: ng new angularName --skip-install导入模块 : cnpm install2 新建组件ng g component components/search3 跟组件中引入组件4 表单模块引入双向绑定需要在app.module.ts中加入:import...原创 2020-03-11 12:16:46 · 179 阅读 · 0 评论 -
angular 笔记--双向绑定基本操练
angular 双向数据绑定语法形式: [(ngModel)]="person.username"其中需要注意的是 radio, checkbox的属性绑定[for]一个简单的用户信息获取:html<div class="username"> 姓名:<input type="text" [(ngModel)]="person.u...原创 2020-03-10 18:10:50 · 180 阅读 · 0 评论 -
components 创建
ng g component components/news创建一个news组件<app-news></app-news> 可以在其他组件中通过这个名称引入import { BrowserModule } from '@angular/platform-browser';import { NgModule } from '@angular/core';...原创 2020-03-09 16:48:52 · 58 阅读 · 0 评论 -
angular js 安装以及创建项目
1 安装node.js2 安装npm 或cnpm3 angular js cmd : cnpm install -g @angular/cli4 ng v 检查是否安装成功创建项目:ng new 项目名称 --skip-install进入项目文件夹:cnpm install运行项目:ng serve --openh...原创 2020-03-09 14:46:20 · 213 阅读 · 0 评论