小编Laz*_*vić的帖子

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

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

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

angular

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

Angular HTTP GET与TypeScript错误http.get(...).map不是[null]中的函数

我在Angular中遇到HTTP问题.

我只想要GET一个JSON列表并在视图中显示它.

服务类

import {Injectable} from "angular2/core";
import {Hall} from "./hall";
import {Http} from "angular2/http";
@Injectable()
export class HallService {
    public http:Http;
    public static PATH:string = 'app/backend/'    

    constructor(http:Http) {
        this.http=http;
    }

    getHalls() {
           return this.http.get(HallService.PATH + 'hall.json').map((res:Response) => res.json());
    }
}
Run Code Online (Sandbox Code Playgroud)

HallListComponentgetHalls从服务中调用方法:

export class HallListComponent implements OnInit {
    public halls:Hall[];
    public _selectedId:number;

    constructor(private _router:Router,
                private _routeParams:RouteParams,
                private _service:HallService) {
        this._selectedId = +_routeParams.get('id');
    }

    ngOnInit() {
        this._service.getHalls().subscribe((halls:Hall[])=>{ 
            this.halls=halls;
        });
    }
}
Run Code Online (Sandbox Code Playgroud)

但是,我有一个例外:

TypeError:this.http.get(...).map不是[null]中的函数 …

rxjs angular

326
推荐指数
6
解决办法
23万
查看次数

Angular EXCEPTION:没有Http的提供者

我正在使用EXCEPTION: No provider for Http!我的Angular应用程序.我究竟做错了什么?

import {Http, Headers} from 'angular2/http';
import {Injectable} from 'angular2/core'


@Component({
    selector: 'greetings-ac-app2',
    providers: [],
    templateUrl: 'app/greetings-ac2.html',
    directives: [NgFor, NgModel, NgIf, FORM_DIRECTIVES],
    pipes: []
})
export class GreetingsAcApp2 {
    private str:any;

    constructor(http: Http) {

        this.str = {str:'test'};

        http.post('http://localhost:18937/account/registeruiduser/',
            JSON.stringify(this.str),
            {
                headers: new Headers({
                    'Content-Type': 'application/json'
                })
            });
Run Code Online (Sandbox Code Playgroud)

angular

322
推荐指数
7
解决办法
21万
查看次数

角度异常:无法绑定到'ngForIn',因为它不是已知的本机属性

我究竟做错了什么?

import {bootstrap, Component} from 'angular2/angular2'

@Component({
  selector: 'conf-talks',
  template: `<div *ngFor="let talk in talks">
     {{talk.title}} by {{talk.speaker}}
     <p>{{talk.description}}
   </div>`
})
class ConfTalks {
  talks = [ {title: 't1', speaker: 'Brian', description: 'talk 1'},
            {title: 't2', speaker: 'Julie', description: 'talk 2'}];
}
@Component({
  selector: 'my-app',
  directives: [ConfTalks],
  template: '<conf-talks></conf-talks>'
})
class App {}
bootstrap(App, [])
Run Code Online (Sandbox Code Playgroud)

错误是

EXCEPTION: Template parse errors:
Can't bind to 'ngForIn' since it isn't a known native property
("<div [ERROR ->]*ngFor="let talk in talks">
Run Code Online (Sandbox Code Playgroud)

angular2-directives angular

319
推荐指数
7
解决办法
10万
查看次数

Angular - 在服务和组件中使用管道

在AngularJS中,我能够使用类似于此的语法在服务和控制器内部使用过滤器(管道):

$filter('date')(myDate, 'yyyy-MM-dd');
Run Code Online (Sandbox Code Playgroud)

是否可以在Angular中使用像这样的服务/组件中的管道?

angular

306
推荐指数
8
解决办法
21万
查看次数

在Angular中,您如何确定活动路线?

注意: 这里有许多不同的答案,大多数都是有效的.事实是,当Angular团队改变其路由器时,有效的改变了很多次.最终将成为 Angular路由器的Router 3.0版本打破了许多这些解决方案,但它提供了一个非常简单的解决方案.从RC.3开始,首选的解决方案是使用[routerLinkActive]本答案中所示.

在Angular应用程序中(当我写这篇文章时,目前在2.0.0-beta.0版本中),您如何确定当前活动路由是什么?

我正在开发一个使用Bootstrap 4的应用程序,我需要一种方法将导航链接/按钮标记为在<router-output>标记中显示其关联组件时处于活动状态.

我意识到,当点击其中一个按钮时,我可以自己维护状态,但这不会涵盖将多条路径放入同一路径的情况(例如主导航菜单以及主要组件中的本地菜单) ).

任何建议或链接将不胜感激.谢谢.

javascript typescript angular2-routing angular

275
推荐指数
17
解决办法
18万
查看次数

Angular - 组件中module.id的含义是什么?

在一个Angular应用程序中,我看到它@Component有属性moduleId.这是什么意思?

module.id没有在任何地方定义时,该应用仍然有效.它怎么还能运作?

@Component({
  moduleId: module.id,
  selector: 'ng-app',
  templateUrl: 'app.component.html',
  styleUrls: ['app.component.css'],
  directives: [AppComponent]
});
Run Code Online (Sandbox Code Playgroud)

systemjs angular2-components angular

216
推荐指数
3
解决办法
7万
查看次数

Angular和Typescript:找不到名字

我正在使用带有TypeScript(版本1.6)的Angular(版本2),当我编译代码时,我得到以下错误:

Error TS2304: Cannot find name 'Map'.
    node_modules/angular2/src/core/change_detection/parser/locals.d.ts(4,42): Error TS2304: Cannot find name 'Map'.
    node_modules/angular2/src/core/facade/collection.d.ts(1,25): Error TS2304: Cannot find name 'MapConstructor'.
    node_modules/angular2/src/core/facade/collection.d.ts(2,25): Error TS2304: Cannot find name 'SetConstructor'.
    node_modules/angular2/src/core/facade/collection.d.ts(4,27): Error TS2304: Cannot find name 'Map'.
    node_modules/angular2/src/core/facade/collection.d.ts(4,39): Error TS2304: Cannot find name 'Map'.
    node_modules/angular2/src/core/facade/collection.d.ts(7,9): Error TS2304: Cannot find name 'Map'.
    node_modules/angular2/src/core/facade/collection.d.ts(8,30): Error TS2304: Cannot find name 'Map'.
    node_modules/angular2/src/core/facade/collection.d.ts(11,43): Error TS2304: Cannot find name 'Map'.
    node_modules/angular2/src/core/facade/collection.d.ts(12,27): Error TS2304: Cannot find name 'Map'.
    node_modules/angular2/src/core/facade/collection.d.ts(14,23): Error TS2304: Cannot find name 'Map'.
    node_modules/angular2/src/core/facade/collection.d.ts(15,25): Error TS2304: …
Run Code Online (Sandbox Code Playgroud)

typescript angular

215
推荐指数
12
解决办法
25万
查看次数

SystemJS和Webpack有什么区别?

我正在创建我的第一个Angular应用程序,我会弄清楚模块加载器的作用是什么.为什么我们需要它们?我试图在Google上搜索和搜索,我无法理解为什么我们需要安装其中一个来运行我们的应用程序?

仅仅用于import从节点模块加载东西是不够的?

我已经按照本教程(使用SystemJS),它让我使用systemjs.config.js文件:

/**
 * System configuration for Angular samples
 * Adjust as necessary for your application needs.
 */
(function(global) {
  // map tells the System loader where to look for things
  var map = {
    'app':                        'transpiled', // 'dist',
    '@angular':                   'node_modules/@angular',
    'angular2-in-memory-web-api': 'node_modules/angular2-in-memory-web-api',
    'rxjs':                       'node_modules/rxjs'
  };
  // packages tells the System loader how to load when no filename and/or no extension
  var packages = {
    'app':                        { main: 'main.js',  defaultExtension: 'js' },
    'rxjs': …
Run Code Online (Sandbox Code Playgroud)

node-modules systemjs webpack angular

213
推荐指数
2
解决办法
9万
查看次数

什么是Angular相当于AngularJS $手表?

在AngularJS中,您可以使用$watch函数来指定观察者观察范围变量的变化$scope.在Angular中观察变量(例如,组件变量)的等价物是什么?

angular2-changedetection angular

204
推荐指数
7
解决办法
14万
查看次数