Angular 2 错误指令

Posted 2023-02-23

【中文标题】Angular 2 错误指令

【英文标题】：Angular 2 error directives

【发布时间】：2017-06-11 13:19:13

【问题描述】：

我可以在这方面使用一些帮助，我正在学习 ANGULAR 2 路由，我收到了这个错误：

app/app.component.ts(7,12): 错误 TS2345: 类型参数 ' 选择器：字符串；模板网址：字符串；指令：（类型 PeliculasListComponent | typeof Peli...' 不可分配给 '选择器类型的参数？：字符串；输入？：字符串[]；输出？： 细绳[];属性？：字符串[]；事件？：字符串...'。种类 属性“指令”不兼容。 类型 '(typeof PeliculasListComponent | typeof PeliculasFooterComponent | typeof "C:/UwAmp/www/curso-ang...' 不是 可分配给类型 '(Type | any[])[]'。 类型 'typeof PeliculasListComponent | typeof PeliculasFooterComponent | typeof "C:/UwAmp/www/curso-angu...' 不是 可分配给类型“类型 |任何[]'。 类型'typeof“C：/UwAmp/www/curso-angular/app/components/contacto.component”'不是 可分配给类型“类型 |任何[]'。 类型'typeof“C：/UwAmp/www/curso-angular/app/components/contacto.component”'不是 可分配给类型“任何[]”。 类型“C:/UwAmp/www/curso-angular/app/components/contacto.component”中缺少属性“长度”。 app/app.component.ts(16,14): error TS2345: Argument of type '( path: 细绳;名称：字符串；组件：PeliculasListComponent 的类型； useAsDefault：布尔值； ...' 不可分配给类型参数 '路线定义 []'。输入'路径：字符串；名称：字符串；零件： PeliculasListComponent 的类型； useAsDefault：布尔值； ...' 不是 可分配给类型“RouteDefinition”。 输入'路径：字符串；名称：字符串；组件：typeof“C：/UwAmp/www/curso-angular/app/components/contac ...”不是 可分配给类型“RouteDefinition”。 属性“组件”的类型不兼容。 类型'typeof“C：/UwAmp/www/curso-angular/app/components/contacto.component”'不是 可分配给类型“类型 |组件定义'。 类型'typeof“C：/UwAmp/www/curso-angular/app/components/contacto.component”'不是 可分配给类型“ComponentDefinition”。 类型 'typeof "C:/UwAmp/www/curso-angular/app/components/contacto.component"' 中缺少属性 'type'。

这是我的代码：

import Component from "angular2/core";
import PeliculasListComponent from "./components/peliculas-list.component";
import PeliculasFooterComponent from "./components/peliculas-footer.component";
import ContactoComponent from "./components/contacto.component";

import ROUTER_DIRECTIVES, RouteConfig, Router from "angular2/router";
@Component(
    selector: "my-app",
    templateUrl: "app/views/peliculas.html",
    directives: [PeliculasListComponent,
                 PeliculasFooterComponent,
                 ContactoComponent, 
                 ROUTER_DIRECTIVES]
)

@RouteConfig([
    path: "/peliculas", name:"Peliculas", component: PeliculasListComponent, useAsDefault: true,
    path: "/contacto", name:"Contacto", component: ContactoComponent*/
])

export class AppComponent
    public titulo:string = "Peliculas con angular" ;

   

你有任何解决方法的想法吗？谢谢！！

【问题讨论】：

看起来你可能已经升级了你的 angular 2 版本并且正在开发一个使用 beta 版本编写的项目。路由和指令（导入）现在属于 NgModule

@JasonGoemaat 只是为了稍微扩展您的观点，这个应用程序是用旧版本编写的，很难找到文档，并且可能存在一组未知的错误和问题。如果您刚刚开始，请升级到最新版本，因为情况发生了变化。如果您要维护现有的应用程序，那么上帝会帮助您。

我不认为这个过程有那么困难，如果你刚刚开始这个项目并且不熟悉测试中的事情是如何完成的，那可能会更困难。你可以看看the NgModule docs 和this guide 在他们介绍 NgModule 时从 RC4 更新到 RC5。基本上创建新的 NgModule 并将组件的声明移动到它并更改引导。

【参考方案1】：

您很可能使用 Angular 的过时版本的候选发布版本，如 cmets 中所述。 因为根据最新的文档在组件装饰器中没有没有指令属性：

https://angular.io/docs/ts/latest/api/core/index/Component-decorator.html

---

从angular.io的指南开始，有很多例子。

否则从 angular 种子项目开始，一切都已配置：

https://github.com/angular/angular-seed

直接从 Angular 尝试本指南，它涵盖了您开始所需的几乎所有内容：

https://angular.io/docs/ts/latest/guide/router.html