Angular 2 - 如何使用this.router.parent.navigate('/ about')导航到另一个路线.
它似乎没有用.我试过location.go("/ about"); 因为那没有用.
基本上一旦用户登录,我想将它们重定向到另一个页面.
这是我的代码如下:
import {Component} from 'angular2/angular2';
import {CORE_DIRECTIVES, FORM_DIRECTIVES} from 'angular2/angular2';
import {Router} from 'angular2/router';
import {AuthService} from '../../authService';
//Model
class User {
constructor(public email: string, public password: string) {}
}
@Component({
templateUrl:'src/app/components/todo/todo.html',
directives: [CORE_DIRECTIVES, FORM_DIRECTIVES]
})
export class Todo {
model = new User('Mark@gmail.com', 'Password');
authService:AuthService;
router: Router;
constructor(_router: Router, _authService: AuthService){
this.authService = _authService;
this.router = _router;
}
onLogin = () => {
this.authService.logUserIn(this.model).then((success) => {
//This is where its …在Angular 2中将用户重定向到完全外部URL的方法是什么.例如,如果我需要将用户重定向到OAuth2服务器以进行身份验证,我该怎么做？
Location.go(),Router.navigate()并且Router.navigateByUrl()可以将用户发送到Angular 2应用程序中的另一个部分(路由),但我看不出它们如何用于重定向到外部站点？
在angular2中,我希望在更改另一个控件时触发一些控件的Validators.有什么方法可以告诉表单重新验证？更好的是,我可以请求特定字段的验证吗？
示例:给定Checkbox X和输入P.输入P有一个验证器,其行为与X的模型值不同.当选中/取消选中X时,我需要在P上调用验证器.P上的验证器将查看模型到确定X的状态并相应地验证P.
这是一些代码:
constructor(builder: FormBuilder) {
this.formData = { num: '', checkbox: false };
this.formGp = builder.group({
numberFld: [this.formData.num, myValidators.numericRange],
checkboxFld: [this.formData.checkbox],
});
}
this.formGp.controls['checkboxFld'].valueChanges.observer({
next: (value) => {
// I want to be able to do something like the following line:
this.formGp.controls['numberFld'].validator(this.formGp.controls['numberFld']);
}
});
有人有解决方案吗？谢谢!
我有一些简单的角度2组件与模板.提交后如何清除表格和所有字段？我无法重新加载页面.用date.setValue('')字段设置数据后是stil touched.
import {Component} from 'angular2/core';
import {FORM_DIRECTIVES, FormBuilder, ControlGroup, Validators, Control} from 'angular2/common';
@Component({
selector: 'loading-form',
templateUrl: 'app/loadings/loading-form.component.html',
directives: [FORM_DIRECTIVES]
})
export class LoadingFormComponent {
private form:ControlGroup;
private date:Control;
private capacity:Control;
constructor(private _loadingsService:LoadingsService, fb:FormBuilder) {
this.date = new Control('', Validators.required);
this.capacity = new Control('', Validators.required);
this.form = fb.group({
'date': this.date,
'capacity': this.capacity
});
}
onSubmit(value:any):void {
//send some data to backend
}
}
装载-form.component.html
<div class="card card-block">
<h3 class="card-title">Loading form</h3>
<form (ngSubmit)="onSubmit(form.value)" [ngFormModel]="form">
<fieldset class="form-group" [class.has-danger]="!date.valid …我是Angular2和Http Observable的新手.我有一个调用Http服务并返回Observable的组件.比我订阅Observable,它工作正常.
现在,我希望在该组件中,在调用第一个Http服务之后,如果调用成功,则调用其他Http服务并返回该Observable.因此,如果第一次调用不成功,则组件返回Observable,而它返回Observable的第二次调用.
所以,问题是,链接Http调用的最佳方法是什么？有没有优雅的方式,比如monads？
我有一个管道返回一个html字符串,但字符串输出转发可能是安全的默认值.我确定必须有一个选项允许html而不能在我搜索文档时找到它.
如何告诉管道允许实际的html渲染？
我一般都是Angular2和Angular的新手,并且在组件的数据发生更改后更新dom后尝试获取一些jQuery.jQuery需要计算元素的高度,所以我不能完全使用数据.不幸的是,看起来onAllChangesDone只在数据更改后触发,而不是dom.
现在提交已被angular2捕获,即使在<form>中有action =.
演示链接:http://plnkr.co/edit/4wpTwN0iCPeublhNumT5？p = preview
//our root app component
import {Component} from 'angular2/core'
@Component({
selector: 'my-app',
providers: [],
template: `
<div>
<h2>Hello {{name}}</h2>
<form action="https://www.google.com" target="_blank" method="POST">
<input name="q" value="test">
<button type="submit">Search</button>
</form>
</div>
`,
directives: []
})
export class App {
constructor() {
this.name = 'Angular2'
}
}
在Angular 2中,如何清除模板缓存？Angular 1有很多答案,但是没有2个答案.
我遇到的问题是,当我更改templateUrl任何组件引用的html页面的内容时,html页面在浏览器中不会更改,直到我手动导航到templateUrl浏览器并点击重新加载.我知道您可以在开发过程中禁用浏览器缓存来解决这个问题,但我担心的是,当我使用Angular 2更新网站时,如果用户将其缓存在浏览器中,用户可以看到过时的html页面.
以下是Angular 1 AngularJS在开发机器上禁用部分缓存的堆栈溢出问题的链接
下面是一个片段,我在app.html更改其内容时遇到更新问题.
@Component({
selector: 'photogallery-app',
templateUrl: './app/app.html',
directives: [ROUTER_DIRECTIVES, CORE_DIRECTIVES]
})
我如何将一项服务注入另一项服务？例如,假设我有一个需要另一个Collection(TeamCollection => PlayerCollection)的Collection.目前我只创建两个单独的集合,并使用类似的东西:
import {PlayerCollection} from "<<folder>>/player";
但是这需要我在Typescript中为我想要成为单例实例的每个服务编写自己的单例getInstance代码.
这样做的正确方法是什么？我希望在我的组件中拥有两个单例,并且能够使用构造函数语法将一个服务注入另一个服务,而无需创建单例的新实例.
class TeamCollection {
constructor(@Inject(PlayerCollection): PlayerCollection) {}
}