技術

ng-ifのelse句でコンポーネントのプロパティと名前重複

投稿日:

こんにちは、コーテッグのこやまです。

Angularを触っていたら、コンポーネントのプロパティの値を変えていないのに、
いつの間にかstringからobjectになっていました。
ngifのelse句の名前がcomponentのパラメーターと同じ名前のとき、
else句の方が優先されるようです。

tsファイル

export class MatchingProjectDetailComponent implements OnInit {
hoge: 'hogeString'
fuga: 'fugaString'
}

htmlファイル

<div *ngIf="project.important_line_judge; else hoge">
  <div>true</div>
<div>
<ng-template #hoge>
  <div>false</div>
<ng-template>


{{hoge}}
// [object Object]

{{fuga}}
// 'fugaString'

ngifではhtmlでの名前重複はもちろんダメですが、tsのプロパティも気をつけましょう。

-技術
-

執筆者:


comment

メールアドレスが公開されることはありません。 が付いている欄は必須項目です

このサイトはスパムを低減するために Akismet を使っています。コメントデータの処理方法の詳細はこちらをご覧ください

関連記事

[Angular6] 一つのタグに複数の条件分岐を書く

こんにちは どうしても一つのタグに複数の条件分岐を書きたい時があるかと思います。 …

no image

hamlをerbに変換する

こんばんは railsの色々な記事を見ていると、hamlで書かれているものも結構 …

no image

[Rails] deviseのパスワード認証を半角英数字だけ許可する

こんばんは ログイン機能を作る時ってdeviseが便利ですよね。 ですが、デフォ …

no image

CSSのpositionで要素を真ん中寄せにする(JS不要)

positionを使って要素を真ん中寄せにする時は、transform: tra …

ブラウザでRailsのrouting設定を確認する

こんにちは Railsでroutingを確認する時、コマンドでrails rou …