[解決済み] ng-forOf」は既知のネイティブプロパティではないため、バインドできない [重複] 。
2022-12-16 10:25:44
質問
私はここで基本的なAngular 2のチュートリアルに従おうとしています。
https://angular.io/docs/js/latest/guide/displaying-data.html
このコードでangularアプリを読み込んで名前を表示させることができますね。
import { Component, View, bootstrap } from 'angular2/angular2';
@Component({
selector: "my-app"
})
class AppComponent {
myName: string;
names: Array<string>;
constructor() {
this.myName = "Neil";
}
}
bootstrap(AppComponent);
しかし、文字列の配列を追加して、ng-forで表示しようとすると、以下のようなエラーを吐いてしまいます。
Can't bind to 'ng-forOf' since it isn't a known native property ("
<p>Friends:</p>
<ul>
<li [ERROR ->]*ng-for="#name of names">
{{ name }}
</li>
"): AppComponent@4:16
Property binding ng-forOf not used by any directive on an embedded template ("
<p>Friends:</p>
<ul>
[ERROR ->]<li *ng-for="#name of names">
{{ name }}
</li>
"): AppComponent@4:12
以下はそのコードです。
import { Component, View, bootstrap } from 'angular2/angular2';
@Component({
selector: "my-app"
})
@View({
template: `
<p>My name: {{ myName }}</p>
<p>Friends:</p>
<ul>
<li *ng-for="#name of names">
{{ name }}
</li>
</ul>
`,
directives: [ NgFor ]
})
class AppComponent {
myName: string;
names: Array<string>;
constructor() {
this.myName = "Neil";
this.names = ["Tom", "Dick", "Harry"];
}
}
bootstrap(AppComponent);
何が足りないのでしょうか?
どのように解決するのですか?
α52を使う場合は
CHANGELOG.md
をチェックしてください。彼らは大文字と小文字を区別するようにテンプレートを変更しました。
ngFor
の代わりに
ng-for
に変更します (他のすべてのディレクティブも同様)。
のような要素名は
<router-outlet>
のような要素名は、カスタム要素のタグ名にダッシュを必要とするカスタム要素仕様と互換性を保つために変更されていません。
で
RC.5 (および最終版) では
ngFor
といったディレクティブはデフォルトでは ambient ではありません。これらは、以下のように明示的に指定する必要があります。
@NgModule({
imports: [CommonModule],
または、モジュールがブラウザのみにロックされることを気にしないのであれば
@NgModule({
imports: [BrowserModule],
この
BrowserModule
輸出
CommonModule
も同様
WorkerAppModule
のようになります。
更新
この
BrowserModule
はappモジュールでインポートする必要があり、他のモジュールでは
CommonModule
が代わりにインポートされるべきです。
関連
-
[解決済み】「ルーターリンク」は既知のプロパティではないため、バインドできない
-
[解決済み] ngModel' は 'input' の既知のプロパティではないため、バインドできません。
-
[解決済み] formGroup' は 'form' の既知のプロパティではないため、バインドできません。
-
[解決済み] Angularのエラーです。"Can't bind to 'ngModel' because it isn't a known property of 'input'"."
-
[解決済み] 例外が発生しました。既知のネイティブプロパティではないため、'ngFor'にバインドできない
-
[解決済み】'formControl'は'input'の既知のプロパティではないのでバインドできない - Angular2 Material Autocomplete問題
-
[解決済み】Angularの例外。ngForIn'は既知のネイティブプロパティではないため、バインドできない
-
[解決済み】Angular2 Exception: routerLink'が既知のネイティブプロパティではないため、バインドできない。
-
[解決済み】'ngForOf'は'tr'の既知のプロパティではないのでバインドできない(最終リリース)
-
[解決済み] コンポーネントクラスからテンプレート参照変数にアクセスする
最新
-
nginxです。[emerg] 0.0.0.0:80 への bind() に失敗しました (98: アドレスは既に使用中です)
-
htmlページでギリシャ文字を使うには
-
ピュアhtml+cssでの要素読み込み効果
-
純粋なhtml + cssで五輪を実現するサンプルコード
-
ナビゲーションバー・ドロップダウンメニューのHTML+CSSサンプルコード
-
タイピング効果を実現するピュアhtml+css
-
htmlの選択ボックスのプレースホルダー作成に関する質問
-
html css3 伸縮しない 画像表示効果
-
トップナビゲーションバーメニュー作成用HTML+CSS
-
html+css 実装 サイバーパンク風ボタン
おすすめ
-
[解決済み] ngIf」は「div」の既知のプロパティではないため、バインドできない [重複] 。
-
[解決済み】'ngForOf'は'tr'の既知のプロパティではないのでバインドできない(最終リリース)
-
[解決済み] angular-cliのビルドでカスタムファイルをインクルードするには?
-
[解決済み] 文字列|ヌル'型の引数は、文字列'型のパラメータに代入できません。タイプ 'null' はタイプ 'string' に割り当てられません。
-
[解決済み] Angular2 bodyタグにクラスを追加する
-
[解決済み] AngularでFormGroupに動的にaddControlを追加する
-
[解決済み] プロパティ 'controls' がタイプ 'AbstractControl' に存在しない Angular 4 [duplicate] 。
-
[解決済み] 64進数の文字列を角(2+)でエンコードおよびデコードする。
-
[解決済み] 角度換算2
-
[解決済み] angularで1つの要素に複数のテンプレートバインディングを適用する方法 [重複].