我正在玩Angular2.作为基础,我使用了angular.io页面中的quickstart项目.
一切似乎工作正常,但一旦我尝试注入一个service(ItemService)到我的AppComponent我得到以下异常:
Token(ComponentRef)实例化期间出错!ORIGINAL ERROR:无法解析AppComponent的所有参数.确保它们都具有有效的类型或注释.
我在互联网上看到过类似的问题(包括stackoverflow,例如这篇文章),但它们似乎都没有解决我的问题.有没有人知道,问题可能是什么?
我还看到了一些解决方案(例如Angular2 repo中的解决方案),它们使用Injectable-annotation 来装饰注入类.然而,这对我不起作用,因为它没有定义angular.d.ts.我使用的是错误的版本吗?
您可以在以下Plunker中找到我的解决方案:http://plnkr.co/edit/7kK1BtcuEHjaspwLTmsg
为了记录,您还可以在下面找到我的两个文件.请注意,app.jsPlunker中的JavaScript文件是从我下面的TypeScript文件生成的JavaScript文件,例外总是相同的.
index.html:
<html>
<head>
<title>Testing Angular2</title>
<script src="https://github.jspm.io/jmcriffey/bower-traceur-runtime@0.0.87/traceur-runtime.js"></script>
<script src="https://jspm.io/system@0.16.js"></script>
<script src="https://code.angularjs.org/2.0.0-alpha.23/angular2.dev.js"></script>
</head>
<body>
<app></app>
<script>
System.import('js/app');
</script>
</body>
</html>
Run Code Online (Sandbox Code Playgroud)
js/app.ts:
/// <reference path="../../typings/angular2/angular2.d.ts" />
import {Component, View, bootstrap, For, If} from "angular2/angular2";
class Item {
id:number;
name:string;
constructor(id:number, name:string) {
this.id = id;
this.name = name;
}
}
class ItemService …Run Code Online (Sandbox Code Playgroud) 我正在玩角度2(目前版本为alpha 26).ng-for和ng-if例如工作正常.但我确实遇到了问题ng-switch.我只是无法让它工作,即没有打印.似乎整个模板都被忽略了.
这是我的组件的代码,也可以在github上找到:
import {Item} from "js/types/item";
import {Component, View, NgFor, NgIf, NgSwitch} from "angular2/angular2";
@Component({
selector: "item-details",
properties: [
"item"
]
})
@View({
template: `<span>You selected {{item.name}},</span>
<span [ng-switch]="item.name">
<template [ng-switch-when]="'Bill'">
<span> who is often called Billy.</span>
</template>
<template [ng-switch-when]="'Bob'">
<span> who is often called Bobby.</span>
</template>
<template [ng-switch-default]">
<span>who has no nickname.</span>
</template>
</span>
<div *ng-if="item.subItems">
<h2>Sub items:</h2>
<ul>
<li *ng-for="#subItem of item.subItems">{{subItem.name}}</li>
</ul>
</div>`,
directives: [NgFor, NgIf, NgSwitch]
}) …Run Code Online (Sandbox Code Playgroud) 我想在 npm 脚本中动态设置一个环境变量。
我正在使用,cross-env因为我正在 Windows 上开发,并且服务器是基于 Unix 的。我想用当前日期 ( new Date())初始化一个环境变量,以便我可以在我的中访问和呈现它create-react-app:
这有效(硬编码字符串):
"scripts": {
"start": "cross-env-shell REACT_APP_BUILD_DATE=\"currentDate\" react-scripts-ts start",
}
Run Code Online (Sandbox Code Playgroud)
显然,currentDate不应是字符串,而是以下表达式的结果:new Date().
我怎样才能做到这一点?换句话说:如何评估一些常规 JavaScript 并将其结果用作 npm 脚本?或者这是不可能的?
TL; DR
我们正在使用Angular 2构建一个应用程序,并希望注册一个"全局" ngOnInit和ngOnDestroy功能.对于"全局",我的意思是该函数是针对每个组件执行的,而不需要为每个组件显式实现.这可能吗?
详细
一些(但不是全部)组件需要在加载(例如ngOnInit)后在全局服务中注册某些内容,并在卸载后再次注销(例如ngOnDestroy).以下是我能想到的两种方法:
ngOnInit和ngOnDestroy).这两种方法都不令人满意:
这就是我提出以下想法的原因:
为什么不用可以由所有必需组件实现的接口替换上面提到的抽象类.然后我会登记其上每执行一个全局函数ngOnInit和ngOnDestroy所有组件(如果可能的话-例如一个模块,路由等中).在函数中,我将检查组件是否实现了接口,如果是,则调用相应的函数以获取要注册的类型特定的东西.
我的问题