以下是为您整理出来关于【angularjs2】合集内容，如果觉得还不错，请帮忙转发推荐。
感觉TypeScript真不错，强类型，有点类似c#的感觉，而且如果写错了编辑器都可以感知出来，于是就开始看ionic2。ionic2是基于angular2的，语法跟以前有了很大的变化。但自己写原生app写惯了，反而觉得这种方式更方便一些。每个页面都是一个组件，组件里也可以套组件，html标签都可以自定义，也就可以无限扩展。虽然ionic2和angular2都还没发布正式版，但手头的这个小东西用一下也未尝不可，就开始动工了。先列一下学习资源：TypeScr...
AngualrJs2官方方法是以@Input,@Output来实现组件间的相互传值，而且组件之间必须父子关系，下面给大家提供一个简单的方法，实现组件间的传值，不仅仅是父子组件，跨模块的组件也可以实现传值/***1.定义一个服务，作为传递参数的媒介*/ @Injectable() export class PrepService{//定义一个属性，作为组件之间的传递参数，也可以是一个对象或方法 profileInfo: any;} /***2.传递参数的组件，我这边简单演示，直接就在构造器里面实...
一: 以组件开发一个to-do list应用todo组件分为导入、接口定义、顶层组件、控制器、启动5个部分。app.ts://导入 import {Component} from ‘@angular/core‘; import {bootstrap} from ‘@angular/platform-browser-dynamic‘;//接口定义interface Todo {completed: boolean;label: string; }//顶层组件@Component({selector: ‘app‘,templateUrl: ‘./app.html‘,styles: [`ul li {list-style: none;}.completed {text-decoratio...
之前在AngularJS2中一种button切换效果的实现（二）中实现了按钮的切换效果，但是方法比较low，这次我们使用Angular2的指令来实现。 指令实现hover效果 import { Directive, ElementRef, HostListener, Input } from @angular/core; @Directive({selector: [myHighlight] }) export class HighlightDirective {constructor(private el: ElementRef) { }@HostListener(mouseenter) onMouseEnter() {this.highlight(red);}@HostListe...
之前用三目表达式和ng-class实现了按钮切换效果，似乎达到了我的预期，但是我觉得还有改进空间，网上找了一些资料，大概还有以下几种实现方式： 路由 <button class="btn1" routerLink="component1" routerLinkActive="active" type="submit">btn1</button> <button class="btn2" routerLink="component2" routerLinkActive="active" type="submit">btn2</button> .active {background-color: white; }将button切换的页面写成一个c...
angularjs2 ng2 密码隐藏显示代码结合ionic2开发移动端项目，注册页的密码的input一般用password，但是用户输入密码时可能会输入错误，需要显示成text。 如图：首先，输入框的类型判断； <ion-input type="{{pwshow?text:password}}" placeholder="输入密码"></ion-input>然后，添加眼睛的点击事件，ngClass判断图标样式；<a href="javascript:;" rel="external nofollow" item-end (click)="pwshow=!pwshow" [ngClass]="pwshow?ey...
父到子组件之间的数据传递 父组件模板中引用子组件// father template： ...<child-item [name] = "fatherItemName" > </child-item>//...` 其中”fatherItemName” 为父组件中的属性，[name] 为子组件的输入 在子组件中使用 @Input() name 来接受父组件传递的值 如果在接收值前需要进行一些处理，可以使用setter 拦截输入属性 _name: string = ;@Input()set nameStr(name: string){_name = "father name:" + name;}这时的 _name 作...
关于http服务 HttpModule并不是angular的核心模块，它是一个附加的模块，存在于@angular/http中，虽然如此但是依然可以在需要的时候使用它，只需要在使用之前引入即可。对于大多数app来说使用http服务是很常见的，所以我们将HttpModule加入到AppModule的import列表和应用的根组件中，这样就可以在整个应用中使用http服务了 在自定义服务中使用Http服务 http服务通过其get方法获取数据，他会返回RxJS Observable，我们希望使用的数据...
AngualrJs2官方方法是以@Input,@Output来实现组件间的相互传值，而且组件之间必须父子关系，下面给大家提供一个简单的方法，实现组件间的传值，不仅仅是父子组件，跨模块的组件也可以实现传值 /***1.定义一个服务，作为传递参数的媒介*/ @Injectable() export class PrepService{//定义一个属性，作为组件之间的传递参数，也可以是一个对象或方法 profileInfo: any;}/***2.传递参数的组件，我这边简单演示，直接就在构造器里面实现...
本文介绍了ANGULAR2 与 D3.js集成实现自定义可视化的方法，分享给大家，具体如下：目标 展现层与逻辑层分离数据与可视化组件相分离数据与视图双向绑定,实时更新代码结构清晰,易于维护与修改基本原理 angular2 的组件生命周期钩子方法\父子组件交互机制\模板语法 源码解析 代码结构很简单，其中除主页index.html和main.ts之外的代码结构如下所示:代码结构app.module.ts import { BrowserModule } from @angular/platform-browser; i...