2017-12-18 7 views
0

これは具体的にイオンまたは角の問題かどうかはわかりません。私は{{}}が何が呼ばれているのかわからないので、これについて何か解決策を見つけるのが難しくなっています。 イオン/角度2 - アプリケーションがクラッシュして、定義されていないことを表示しようとしています

私は、HTMLのかなり単純なビットが

<ion-content padding> 
    <ion-card> 
    <ion-card-content> 
     <ion-row> 
     <ion-col> 
      <h2>Record: {{teamStanding.wins}}-{{teamStanding.losses}}</h2> 
      <p>Coach: {{team.coach}}</p> 
     </ion-col> 
     <ion-col> 
      <!-- Placeholder --> 
     </ion-col> 
     </ion-row> 
    </ion-card-content> 
    </ion-card> 
</ion-content> 

teamStandingを表示するために、チームは私がプロパティを読み取ることができません」というエラーを取得し、このページに移動するとき

問題は、あるionViewDidLoadにデータが移入されてい定義されていない "勝利" ionViewDidLoadを実行することなくこれをやっている - それは決してヒットしない、エラーをスローし、すべてを停止する。

これがangleJS {{teamStanding.wins}}であれば、定義されていない状態になるまで空白になります...私が取り組んでいるこのプロジェクトはさらに複雑ですが、この全く同じコードはエラーなしで実行されます。一見インストラクターの{{}}に未定義のデータを置いてもエラーは発生しません。何がありますか?なぜ私が期待するようにこれは黙って失敗しないのですか?明らかに

私は空のオブジェクトとしてteamStandingを宣言した場合、このコードがエラーなしで実行されますが、私はteamStanding.thing.thing.thing.thingような何かをしていた場合、私は一時/ダミーオブジェクト{ものを作成する必要があります:{ thing:{thing:{thing:}}}}これがionViewDidLoadまで動作するようにするには!

+1

'?' '{{teamStanding?.wins}}'これは、 'teamStanding.wins'にアクセスしようとする前に' teamStanding'が存在するかどうかを確認するためにangleを通知します。代わりに、 'ion-col'をngIfで囲むことで' teamStanding'が存在するまで内部要素がレンダリングされないようにします。 ' ...' – LLai

+0

Pluralsight much?この同じ問題があって、SNOで解決しました。投稿とソリューションをありがとう! – DMP

答えて

3

安全ナビゲーションオペレーターの具体的な内容です。あなたが他の言語でElvisオペレータに精通しているなら、それは同じことです。だから、あなたの例では、それは次のようになります。

{{ teamStanding?.wins }} - {{ teamStanding?.losses }} 

この方法では、nullまたは未定義のオブジェクトが例外をスローしません。

0

{{}}がどのような名前で呼ばれているのかわかりませんので、解決策を見つけるのが難しくなります。 "補間"、 "データバインディング"を呼び出します。

safe operatorを使用することをお勧めします.HTMLテンプレートを取得しようとするとおそらくteamStandingプロパティが実際には定義されていないからです。

関連する問題