2016-07-23 16 views
0

md-toolbarとmd-content構造を実装する際に奇妙で面倒な問題が発生しました。角材md-content - 入力フォーカスの正しい位置にスクロールしないコンテンツ

その下の画面領域の要素に焦点を合わせると、ラベルと入力フィールドを表示するために画面が適切な位置にスクロールしないようです。

md-contentコンテナーを削除すると、すべてが受け入れられたものとして動作し、入力とデータも開始され、今度はmdコンテンツのスクロール位置が再び正常になります。

スクロールイベントが何とか破棄されたのでしょうか?ユーザーが彼要求された要素であることを理解し、それだけで、モバイル機器で閲覧表示するには、手動で

コンテンツをスクロールする必要がないため、UI/UXの視点で

は、それが(本当の問題ですchrome 51 +私の場合はAndroid 4.4.2)をデフォルトの角度素材入力デモに置き換え、より低いレベルの入力要素に集中しようとします。

https://material.angularjs.org/latest/demo/input

任意のアイデア/回避策は、非常に参考になります。私は必要なときmd-contentdivに置き換えることができ、私の最初のコメントで述べたように、あなたの最後のコメントへの答えで

+0

で達成されます。なぜあなたは 'md-content'を使用する必要がありますか?動作しない場合は使用しないでください。角度のある素材が推奨されますが、すべての状況で必ずしも必要ではありません。 –

+0

10x @camden_kidですが、md-toolbarスティッキーヘッダーをサポートするには、コンテンツがmd-content内にある必要があります。 –

+0

「スティッキーヘッダー」とはどういう意味ですか?以下はmd-toobarの例で、 'md-content'を置き換えた' div'を使ったdocから取ったものです - http://codepen.io/camden-kid/pen/GqdEGr –

答えて

1

このCodePen

を参照してください。スティッキーmd-toolbarは、

<div style="overflow-y:auto" flex> 
+0

10倍ですが、それでもなおmd-contentを使用していないのは奇妙ですトリガフォーカスイベント。私は、角度の材料のgithubのレポで関連チケットを開いた –

+1

@ EladHirschはい、それは奇妙です。私はちょうど私の携帯電話で入力デモを試して、あなたはビューが入力にスクロールしないと言うように。 'md-content'を本当に使いたいと思う唯一の解決策は' $ anchorScroll'を使ってコードをスクロールすることです - https://docs.angularjs.org/api/ng/service/$anchorScroll –

関連する問題