小编Ang*_*arM的帖子

如何检测Angular中的路由变化?

我期待检测我的路线变化AppComponent.

此后,我将检查全局用户令牌以查看他是否已登录.然后,如果用户未登录,我可以重定向用户.

angular

352
推荐指数
16
解决办法
31万
查看次数

Angular 2 - 如何使用this.router.parent.navigate('/ about')导航到另一个路线?

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 …
Run Code Online (Sandbox Code Playgroud)

javascript angular2-routing angular

154
推荐指数
4
解决办法
26万
查看次数

如何提高Angular2应用程序的加载性能?

Angular2应用程序加载缓慢,如何提高负载性能?

我使用Angular2,打字稿和html5.

目前我的应用需要4秒才能加载.我使用Firebase托管并使用cloudflare.

我正在做的事情/信息:

  • 我压缩了图像.
  • 我缩小了CSS
  • 我缩小了js.
  • 我在脚本上使用async.
  • 我的脚本在我的.
  • 脚本大约700kb
  • 我使用谷歌速度测试获得65%
  • 我使用了libs的缩小版本,例如bootstrap等.
  • 使用systemjs.
  • 这是使用的种子应用程序:https://github.com/mgechev/angular-seed

流:

当应用程序加载时,它会显示一个蓝屏(这是bootstrap css),然后4秒后应用程序加载并且工作得非常快.但需要4秒钟才能加载.似乎systemjs缩小的app.js文件正在减慢整个应用程序,并且没有足够快地显示视图.

这是我的网站速度测试: https ://www.webpagetest.org/result/161206_F5_N87/

这是我的网站:

https://thepoolcover.co.uk/

如果您需要有关我的应用程序的更多信息以及我可以执行的任何其他操作,请告诉我.

javascript performance systemjs angular2-routing angular

52
推荐指数
3
解决办法
4万
查看次数

我的angular 2应用程序需要很长时间才能为首次使用的用户加载,我需要帮助才能加快速度

下面我已经粘贴在我的app.ts文件中.

我正在使用angular2,带有firebase和打字稿.

原因很慢,因为我有很多路线而且我注入了很多文件?

此外,我的应用程序工作正常,只是第一次访问主页我有这个问题的用户.

我不确定是否可以在底部改进引导程序,或者我是否做错了什么.

这是我的app.ts文件:

import {Component, bind, provide, Injectable} from 'angular2/core';
import {bootstrap} from 'angular2/platform/browser'
import {NgIf} from 'angular2/common';
import {Router, Location, ROUTER_BINDINGS, RouterOutlet, RouteConfig, RouterLink, ROUTER_PROVIDERS, APP_BASE_HREF, CanActivate, OnActivate,
    ComponentInstruction} from 'angular2/router';
import {HTTP_PROVIDERS, Http, Headers} from 'angular2/http';
import {ANGULAR2_GOOGLE_MAPS_PROVIDERS} from 'angular2-google-maps/core';
import {enableProdMode} from 'angular2/core';
enableProdMode();

import {LoggedInRouterOutlet} from './interceptor';

import {AuthService} from './services/authService/authService';
import {SocialService} from './services/socialService/socialService';
import {UserService} from './services/userService/userService';
import {OrganisationService} from './services/organisationService/organisationService';
import {NotificationService} from './services/notificationService/notificationService';
import {EmailService} from './services/emailService/emailService';

import {UserProfile} …
Run Code Online (Sandbox Code Playgroud)

typescript angular

39
推荐指数
4
解决办法
5万
查看次数

SendGrid API密钥无法正常工作."提供的授权许可无效,已过期或已撤销"

SendGrid似乎阻止我的节点js服务器发送电子邮件.

我在发送电子邮件时的响应中收到此错误消息:

"提供的授权许可无效,已过期或已撤销"

我也有一个API密钥设置,并遵循文档.

node.js sendgrid

29
推荐指数
2
解决办法
1万
查看次数

如何提供Angular 2 dist文件夹index.html

我正在使用这个有角度的4种子应用程序:https://github.com/2sic/app-tutorial-angular4-hello-dnn

它使用webpack并且工作正常.

它似乎只提供开发文件而不是dist /文件夹.

我想要提供dist文件夹.

不确定执行此操作的命令,或者我是否需要安装lite服务器或其他东西.

我运行此命令来创建dist文件夹(工作正常):

g build --prod --aot --output-hashing=none
Run Code Online (Sandbox Code Playgroud)

现在我想在浏览器中运行此构建.

webpack webpack-dev-server angular

29
推荐指数
6
解决办法
4万
查看次数

当我刷新我的网站时,我得到了404.这是使用Angular2和firebase

当我刷新我的网站时,我得到了404.这是使用Angular2,typescript和firebase.

我已经使用我的Angular2应用程序部署到firebaseapp.

路线似乎改变得很好,但是当我刷新浏览器时,它会将我重定向到404页面.

当我在本地刷新时,这不会发生.

我错过了任何路线设置或Firebase设置吗?

这是我的firebase.json文件:

 {
   "firebase": "test",
   "public": "src",
   "ignore": [
     "firebase.json",
     "**/.*",
     "**/node_modules/**"
   ]
 }
Run Code Online (Sandbox Code Playgroud)

firebase typescript firebase-security firebase-hosting angular

24
推荐指数
4
解决办法
5万
查看次数

Angular9:目标入口点“@angular/fire/auth”中的错误缺少依赖项

当我运行 npm run start 时,出现以下有关 firebase 的错误。

技术:Angular 版本 9、Firebase、Firestore、Geofirestore Angular CLI。

错误

ERROR in The target entry-point "@angular/fire/auth" has missing dependencies:
 - firebase/auth
 - firebase/app
Run Code Online (Sandbox Code Playgroud)

需要注意的依赖:

"@angular/cli": "~9.1.1",
"@angular/core": "~9.1.1",
"@angular/fire": "^5.1.1",
"firebase": "5.10.1",
"geofirestore": "3.2.3",
Run Code Online (Sandbox Code Playgroud)

包 json

{
  "name": "project",
  "version": "1.0.0",
  "scripts": {
    "ng": "ng",
    "start": "ng serve -o",
    "build": "ng build",
    "test": "ng test",
    "lint": "ng lint",
    "e2e": "ng e2e",
  },
  "private": true,
  "dependencies": {
    "@agm/core": "^1.1.0",
    "@angular/animations": "~9.1.1",
    "@angular/cdk": "^9.2.0",
    "@angular/common": "~9.1.1", …
Run Code Online (Sandbox Code Playgroud)

firebase angularfire angular angular9 angular-cli-v9

23
推荐指数
3
解决办法
2万
查看次数

Angular 2 - 什么是存储全局变量(如身份验证令牌)的最佳方式,以便所有类都可以访问它们?

仅限Angular 2问题:

什么是存储全局变量(如身份验证令牌或基本URL)(环境设置)的最佳方法,以便所有类都可以访问它们而不会在刷新时丢失它们?

因此,当我登录时,我将为用户提供一个身份验证令牌,并且通常将其存储在$ rootscope中以获得角度1.x.

typescript angular

19
推荐指数
2
解决办法
3万
查看次数

将Access-Control-Allow-Origin设置为*的Angular 2 http请求

我正在使用angular2和打字稿.

我正试图发布到我的邮件黑猩猩订阅列表.

我的代码到目前为止:

 constructor(router: Router, http: Http){   
      this.router = router;

      this.http = http; 
      this.headers = new Headers();
      this.headers.append('Content-Type', 'application/json');
      this.headers.append('Access-Control-Allow-Origin', '*');
  }

  subscribe = () => {
        var url = "https://thepoolcover.us10.list-manage.com/subscribe/post?u=b0c935d6f51c1f7aaf1edd8ff&id=9d740459d3&subscribe=Subscribe&EMAIL=" + this.email;
        this.isSuccess = false;

        this.http.request(url, this.headers).subscribe(response => {
           console.log(response);
           this.isSuccess = true; 
        });   
  }
Run Code Online (Sandbox Code Playgroud)

这是我在控制台中遇到的错误:

在此输入图像描述

我现在收到此错误:Uncaught SyntaxError:Unexpected token <

目前的代码如下:

export class Footer{
  email: string = "";
  router : Router;
  http : Http;
  jsonp: Jsonp;
  isSuccess: boolean = false;

  constructor(router: Router, jsonp: Jsonp, http: Http){   
      this.router = router; …
Run Code Online (Sandbox Code Playgroud)

angular-http angular

16
推荐指数
1
解决办法
5万
查看次数