반응형
각도 2 구성 요소 지침이 작동하지 않음
저는 angle2 초보자이고 첫 번째 앱을 작동시키고 싶습니다.저는 TypeScript를 사용하고 있습니다.todos.component라는 다른 구성 요소에 대해 지시를 내린 app.component.ts가 있지만 컴파일 시 다음 오류가 발생합니다.
[0] app/app.component.ts(7,3): error TS2345: Argument of type '{ moduleId: string; selector: string; directives: typeof TodosComponent[]; templateUrl: string; s ...' is not assignable to parameter of type 'Component'.
[0] Object literal may only specify known properties, and 'directives' does not exist in type 'Component'.
내 코드는 다음과 같습니다.
색인.
<html>
<head>
<title>Angular 2 QuickStart</title>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="stylesheet" href="styles.css">
<!-- 1. Load libraries -->
<!-- Polyfill(s) for older browsers -->
<script src="node_modules/core-js/client/shim.min.js"></script>
<script src="node_modules/zone.js/dist/zone.js"></script>
<script src="node_modules/reflect-metadata/Reflect.js"></script>
<script src="node_modules/systemjs/dist/system.src.js"></script>
<!-- 2. Configure SystemJS -->
<script src="systemjs.config.js"></script>
<script>
System.import('app').catch(function(err){ console.error(err); });
</script>
</head>
<!-- 3. Display the application -->
<body>
<app-root>Loading...</app-root>
</body>
</html>
app.component.ts
import { Component } from '@angular/core';
import {TodosComponent} from './todos/todos.component';
@Component({
moduleId : module.id,
selector: 'app-root',
directives: [TodosComponent],
templateUrl : 'app.component.html',
styleUrls : ['app.component.css']
})
export class AppComponent {
title: string = "Does it work?";
}
app.component.vmdk:
<h1> Angular 2 application</h1>
{{title}}
<app-todos></app-todos>
todos.component.ts
import { Component, OnInit } from '@angular/core';
@Component({
moduleId : module.id,
selector: 'app-todos',
template: '<h2>Todo List</h2>'
})
export class TodosComponent {
title: string = "You have to do the following today:";
}
지시가 없으면 앱이 잘 작동합니다.어떤 도움이라도 주시면 감사하겠습니다!
잘 부탁드립니다!
당신의app.component.ts사용자가 정의한directive: [TodosComponent]지시 속성이 RC6에서 제거되었습니다.@Component()장식가
이에 대한 해결책은 다음과 같습니다.
- NgModule을 생성합니다.
- 내부에 Todos 구성 요소를 선언
declarations: []배열
AppModule의 예는 다음을 참조하십시오.
https://angular.io/docs/ts/latest/tutorial/toh-pt3.html
module.id 은 angular2가 베타 버전일 때 처음에 추가되었습니다.새 버전과 Angular CLI 지원을 사용하면 moduleId:module.id 을 추가할 필요가 없으므로 .ts 파일에서 제거할 수 있습니다.
언급URL : https://stackoverflow.com/questions/39658186/angular-2-component-directive-not-working
반응형
'programing' 카테고리의 다른 글
| MariaDB Galera Cluster 노드가 디스크에 많이 액세스하여 성능이 크게 저하됨 (0) | 2023.06.29 |
|---|---|
| 모든 하위 플롯 위에 단일 주 제목을 설정하는 방법 (0) | 2023.06.29 |
| 스프링 부트 데이터 카산드라 반응성 JmxReporter 문제 (0) | 2023.06.29 |
| Angular 4/5 HttpClient: 문자열 형식의 인수를 'body'에 할당할 수 없습니다. (0) | 2023.06.29 |
| to_char 함수를 사용하여 문자열로 구문 분석할 때 Oracle에서 일 및 월 값에서 선행 0을 제거하는 방법은 무엇입니까? (0) | 2023.06.29 |