我期待检测我的路线变化AppComponent.
此后,我将检查全局用户令牌以查看他是否已登录.然后,如果用户未登录,我可以重定向用户.
我在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)
在HallListComponent我getHalls从服务中调用方法:
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]中的函数 …
我正在使用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) 我究竟做错了什么?
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) 在AngularJS中,我能够使用类似于此的语法在服务和控制器内部使用过滤器(管道):
$filter('date')(myDate, 'yyyy-MM-dd');
Run Code Online (Sandbox Code Playgroud)
是否可以在Angular中使用像这样的服务/组件中的管道?
注意: 这里有许多不同的答案,大多数都是有效的.事实是,当Angular团队改变其路由器时,有效的改变了很多次.最终将成为 Angular路由器的Router 3.0版本打破了许多这些解决方案,但它提供了一个非常简单的解决方案.从RC.3开始,首选的解决方案是使用[routerLinkActive]如本答案中所示.
在Angular应用程序中(当我写这篇文章时,目前在2.0.0-beta.0版本中),您如何确定当前活动路由是什么?
我正在开发一个使用Bootstrap 4的应用程序,我需要一种方法将导航链接/按钮标记为在<router-output>标记中显示其关联组件时处于活动状态.
我意识到,当点击其中一个按钮时,我可以自己维护状态,但这不会涵盖将多条路径放入同一路径的情况(例如主导航菜单以及主要组件中的本地菜单) ).
任何建议或链接将不胜感激.谢谢.
在一个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) 我正在使用带有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) 我正在创建我的第一个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) 在AngularJS中,您可以使用$watch函数来指定观察者观察范围变量的变化$scope.在Angular中观察变量(例如,组件变量)的等价物是什么?