Angular学习笔记
小刘吃饱饱
醒醒!敲代码了
展开
-
Angularjs 定义 、引用数据模型
1.传统方法export class ingredient{ public name:string; public amount:number;constructor(name:string,amount:number){ this.name=name; this.amount=amount; }}2.简写方法(上面的一串代码可简写为:)export class ingredient{ constructor(public name:string,public amount:numb原创 2020-11-03 23:30:02 · 272 阅读 · 0 评论 -
Angular中使用bootstrap js中使用bootstrap (sublime text软件)
1.下载BootStrap,放到sublime的package里的user下2.在sublime中如果下载排package control,就直接Ctrl+Shift+p搜索下载这两个插件如果sublime没有下载package control,就1、下载Package Control.sublime-package插件管理器的安装文件包。2、打开Sublime Text的配置存放目录,可以从Preferences > Browse Packages(设置->浏览资源包),并把下载原创 2020-11-03 14:24:05 · 202 阅读 · 0 评论 -
angular *ngFor循环 的使用
ts:arr=[{name:'xiao1'},{name:'xiao2'},{name:'xiao3'}{name:'xiao4'}]html:<button *ngFor="let i of arr "> {{i.name}}</button>在按钮上输出name值原创 2020-10-29 11:33:02 · 2124 阅读 · 0 评论 -
angular 引入css的两种方法
在ts文件中 @Component({法1:styleUrls:['css文件路径']法2:styles:[` //直接写css样式 格式和在css文件里面一样 例如 a{ color:red; }`]//注意 是反引号 `` tab键上面那个})里面写原创 2020-10-29 09:57:50 · 1682 阅读 · 0 评论 -
angular [ngStyle]和[ngClass]的用法 (举例)
举个栗子:利用数学的随机数函数,来获取在线/离线状态,分别给这两种状态添加样式ts文件export class MyownComponent{ state:string="离线"; contructor(){ this.state=Math.random()>0.5? "离线":"在线" } Getstate(){ return state;//返回上面得到的状态 不能在上面的函数中写return 会报错 } getStyle(){ //这个函数用来设置不同状态下的样式原创 2020-10-29 09:49:26 · 719 阅读 · 0 评论 -
angular *ngIf 和 *ngIf else的用法 (举例)
举个栗子:点击删除评论,删除后新增按钮(点击撤回)html:<button (click)="delComment()">删除</button><textarea *ngIf="Comment ; else Donotdel">每个人心里都有一团火,路过的人只看到烟</textarea>//固定样式 ng-complate标签包裹else的情况 #跟else后的变量名 <ng-template #Donotdel> //else的情原创 2020-10-28 09:29:36 · 2765 阅读 · 0 评论 -
Angular 属性绑定 事件绑定2 禁用按钮两秒后启动按钮点击创建服务并得到反馈
<button [disabled]="!createserve" (click)="showContent()">{{PromptText}}</button><p>{{Content}}</p>export class MyownComponent{ createserve=false; Content="服务没有创建"; PromptText="两秒后可创建服务" constructor(){ setTimeout(()=>{原创 2020-10-27 16:54:23 · 340 阅读 · 0 评论 -
angular 双向绑定和事件绑定实现 输入框内容输出
ps:希望能一起交流进步!小刘一直在线!!!双向绑定(即属性和事件) 格式 [(ngModule)]=" "html文件内容<h1><a>双向绑定:</a><input [(ngModel)]="txt1" /><a>{{txt1}}</a></h1>事件绑定 格式: (事件名)=" "html文件内容<h1><a>事件绑定:</a><input (inp原创 2020-10-26 20:58:45 · 672 阅读 · 0 评论 -
angular 属性绑定 事件绑定(点击事件)
实例:2s后按钮由禁用转为启用状态 且可点击创建服务效果图:点击按钮后html页面按钮 和 提示文字 设置<button [disabled]="!allow" (click)="createserve()">{{text}}</button>//[disabled]是属性设置 控制按钮是否禁用 " "引号内容是调用ts文件里的变量//(click)按钮点击事件绑定,等号右边是调用ts文件里的创建服务函数 {{prompttext}}//插值表达式 引用变量原创 2020-10-26 12:19:27 · 4581 阅读 · 0 评论 -
Angular 禁用按钮 2s后启用按钮
html文件按钮的设置(按钮的初始状态为禁用)<button [disabled]="!allow">测试按钮</button>ts文件下类的定义export class MyownComponent{ allow=false; constructor(){ setTimeout(()=>{ this.allow=true },2000) }}两秒后按钮改为启用状态...原创 2020-10-26 11:13:13 · 390 阅读 · 0 评论 -
Angular在sublime编辑器中如何添加注释???
1.Ctrl+Shift+p在sublime给angular添加彩色注释后,就可以添加注释2.Ctrl+/ 进行单行注释,按 Ctrl+Shift+/ 多行注释原创 2020-10-25 18:22:56 · 234 阅读 · 0 评论 -
如何使Angular在sublime中呈彩色提示???
在sublime中 按Shift+Ctrl+p ,出现下面提示,回车 就能出现彩色提示但是创建新文件不会自动更改样式,还需要重复上述操作有什么一劳永逸的方法吗?希望大佬指点!!!原创 2020-10-25 18:11:03 · 180 阅读 · 0 评论 -
cmd命令行创建Angular新组件和新项目
ng g component 组件名或者 ng g conponent 文件夹/组件名(这种是把新组件放入指定文件夹) 下图是把新组件newnew 放入myapps文件夹下注意!ng new 项目名 是创建angular 新项目(不是新组件)原创 2020-10-25 17:20:09 · 359 阅读 · 0 评论