[英]angular 2 router change url without reload
I translate google sign in javascript to typescript, and it works, the issue. 我将google登录javascript转换为打字稿,并且可以解决问题。
I'm having is when I call _router variable inside the google sign in function attachSignin()
the browser url changes correctly but does not redirect the page it just stays there and gives no error. 我遇到的是当我在Google登录函数
attachSignin()
调用_router变量时,浏览器的URL正确更改,但没有重定向页面,它只是停attachSignin()
,没有错误。
I already try to add zones but nothin happen just the same here is the code 我已经尝试添加区域,但是没有发生同样的事情,这里是代码
this is my code 这是我的代码
import {Component, NgZone} from "angular2/core";
import {ToastsManager } from 'ng2-toastr/ng2-toastr';
import {Router, ROUTER_PROVIDERS} from 'angular2/router'
// Google's login API namespace
declare var gapi: any;
@Component({
selector: "sous-app",
templateUrl: "app/login/login.html",
providers: [ToastsManager, ROUTER_PROVIDERS]
})
export class Login {
googleLoginButtonId = "google-login-button";
userAuthToken = null;
userDisplayName = "empty";
auth2 = null;
self = this;
zoneImpl: NgZone;
constructor(zone: NgZone, private _router: Router) {
this.zoneImpl = zone;
}
// Angular hook that allows for interaction with elements inserted by the
// rendering of a view.
ngAfterViewInit() {
var loginProxy = $.proxy(this.attachSignin, this);
var redirectToPolls = $.proxy(this.redirectToPolls, this);
gapi.load('auth2', function () {
// Retrieve the singleton for the GoogleAuth library and set up the client.
self.auth2 = gapi.auth2.init({
client_id: '718161509287-jdpqsuebcoteh847krjn0m1odnbo5i3q.apps.googleusercontent.com',
cookiepolicy: 'single_host_origin',
// Request scopes in addition to 'profile' and 'email'
//scope: 'additional_scope'
});
loginProxy(document.getElementById('customBtn'));
});
}
attachSignin = (element) => {
var navigate = false;
console.log(element.id);
self.auth2.attachClickHandler(element, {},
(googleUser) => { {
var profile = googleUser.getBasicProfile();
console.log('ID: ' + profile.getId()); // Do not send to your backend! Use an ID token instead.
console.log('Name: ' + profile.getName());
console.log('Image URL: ' + profile.getImageUrl());
console.log('Email: ' + profile.getEmail());
//HERE I WANT TO REDIRECT ROUTER
this.zoneImpl.run(() => this._router.navigate(['Polls']));
console.log(googleUser.getAuthResponse().id_token);
}, function (error) {
alert(JSON.stringify(error, undefined, 2));
});
}
}
Did you "provide" ROUTER_PROVIDERS
anywhere else? 您是否在其他任何地方“提供”
ROUTER_PROVIDERS
? other than in the Login
component, perhaps in bootstrap(...[ROUTER_PROVIDERS])
? 除了在
Login
组件中之外,也许在bootstrap(...[ROUTER_PROVIDERS])
? because you can provide it only once across the whole app. 因为您只能在整个应用程序中提供一次。 If you provide it multiple times, you will see strange behavior in routing without errors.
如果多次提供,则会在路由中看到奇怪的行为而没有错误。
I would expect this to throw 我希望这会抛出
this.zoneImpl.run(() => this._router.navigate(['Polls']));
If you change all 如果全部改变
function ()
to 至
() =>
and use this
instead of self
and get rid of self
entirely it should work. 并使用
this
代替self
并完全摆脱self
它应该起作用。
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.