typescript 模块“angular2/angular2”没有导出成员“For”
声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow
原文地址: http://stackoverflow.com/questions/30770222/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
Module '"angular2/angular2"' has no exported member 'For'
提问by Franva
I am following the tutorial on the official Angular2 website.
我正在关注官方 Angular2 网站上的教程。
https://angular.io/docs/js/latest/guide/displaying-data.html
https://angular.io/docs/js/latest/guide/displaying-data.html
Here is my .ts file:
这是我的 .ts 文件:
/// <reference path="typings/angular2/angular2.d.ts" />
import {Component, View, bootstrap, For} from 'angular2/angular2';
@Component({
selector: 'display'
})
@View({
template: '<p>name: {{myName}}</p>' +
'<p>Friends:</p>' +
'<ul>'+
'<li *for="#name of names">'+
'{{name}}'+
'<li>'+
'<ul>',
directives: [For]
})
class DisplayComponent{
myName: string;
names: Array<string>;
constructotr(){
this.myName = "Alice";
this.names = ["Winston", "Alex", "Shannon", "Irizu"];
}
}
bootstrap(DisplayComponent);
Here is my html:
这是我的 html:
<html>
<head>
<script src="https://github.jspm.io/jmcriffey/[email protected]/traceur-runtime.js"></script>
<script src="https://jspm.io/[email protected]"></script>
<script src="https://code.angularjs.org/2.0.0-alpha.23/angular2.dev.js"></script>
</head>
<body>
<display></display>
<script>
System.import('show-properties');
</script>
</body>
</html>
And I have installed angular2, Rx and es6-promise.
我已经安装了 angular2、Rx 和 es6-promise。
Still the error persists.
错误仍然存在。
message TS6042: Compilation complete. Watching for file changes. message TS6032: File change detected. Starting incremental compilation... show-properties.ts(2,37): error TS2305: Module '"angular2/angular2"' has no expo rted member 'For'. message TS6042: Compilation complete. Watching for file changes.
消息 TS6042:编译完成。监视文件更改。消息 TS6032:检测到文件更改。开始增量编译... show-properties.ts(2,37): error TS2305: Module '"angular2/angular2"' has no exported member 'For'。消息 TS6042:编译完成。监视文件更改。
Update
更新
Here is my updated .ts code:
这是我更新的 .ts 代码:
/// <reference path="typings/angular2/angular2.d.ts" />
import {
ComponentAnnotation as Component,
ViewAnnotation as View, bootstrap, NgFor
} from 'angular2/angular2';
@Component({
selector: 'display'
})
@View({
template: '<p>name: {{myName}}</p>' +
'<p>Friends:</p>' +
'<ul>'+
'<li *ng-for="#name of names">'+
'{{name}}'+
'<li>'+
'<ul>',
directives: [NgFor]
})
class DisplayComponent{
myName: string;
names: Array<string>;
constructotr(){
this.myName = "Alice";
this.names = ["Winston", "Alex", "Shannon", "Irizu"];
}
}
bootstrap(DisplayComponent);
angular2.d.ts is still alpha 26.
angular2.d.ts 仍然是 alpha 26。
Now there is no error message and I can see
现在没有错误消息,我可以看到
name: Friends:
姓名: 朋友:
But no values are inserted. And I've got an error message:
但是没有插入值。我收到一条错误消息:
show-properties.ts(7,2): error TS2348: Value of type 'typeof ComponentAnnotation ' is not callable. Did you mean to include 'new'? show-properties.ts(10,2): error TS2348: Value of type 'typeof ViewAnnotation' is not callable. Did you mean to include 'new'? message TS6042: Compilation complete. Watching for file changes.
show-properties.ts(7,2):错误 TS2348:“typeof ComponentAnnotation”类型的值不可调用。您的意思是包括“新”吗?show-properties.ts(10,2):错误 TS2348:“typeof ViewAnnotation”类型的值不可调用。您的意思是包括“新”吗?消息 TS6042:编译完成。监视文件更改。
回答by PSL
Your issue is that the documentation is not in sync. If you followed the documentation for installation recently then it would have installed the typings for latest version alpha26, which has a lot of broken changes. And the documentation uses a23 version with that version of code. You can either
您的问题是文档不同步。如果您最近按照安装文档进行操作,那么它会安装最新版本 alpha26 的类型,该版本有很多损坏的更改。并且文档使用带有该版本代码的 23 版本。你可以
1) Update your typings to older version that matches v23, which you can find it here. Copy the contents and replace it in ./typings/angular2/angular2.d.ts
.
1) 将您的输入更新为与 v23 匹配的旧版本,您可以在此处找到它。复制内容并将其替换为./typings/angular2/angular2.d.ts
.
2) Upgrade your angular script to alpha 26and fix couple of things.
2) 将您的 angular 脚本升级到alpha 26并修复一些问题。
For
is nowNgFor
,If
is nowNgIf
*for
is now*ng-for
,*if
is now*ng-if
...injectables
(if you intend to use in your directive settings) is nowappInjector
install typings for
es6-promise
,rx
andrx-lite
using the sametsd query xxx --action install
command.
For
现在NgFor
,If
现在NgIf
*for
现在*ng-for
,*if
现在*ng-if
……injectables
(如果您打算在指令设置中使用)现在是appInjector
安装typings for
es6-promise
,rx
并rx-lite
使用相同的tsd query xxx --action install
命令。
You could also use the startup from angular-class webpack starter.
回答by TGH
Yes, the renamed for to ng-for. Same with ng-if. Just update it in your ts file and view.
是的,将 for 重命名为 ng-for。与 ng-if 相同。只需在您的 ts 文件中更新它并查看。
I have a few samples here if you are interested in some working Angular 2.0 examples: http://www.syntaxsuccess.com/viewarticle/angular-2.0-examples
如果您对一些可用的 Angular 2.0 示例感兴趣,我这里有一些示例:http: //www.syntaxsuccess.com/viewarticle/angular-2.0-examples