md-list-item内のテキストを選択可能にしたい。しかし、要素のng-clickが設定されていると、行全体がボタンになり、ユーザーが要素のテキストを選択できなくなることがわかりました。どのように私はこの機能をオーバーライドすることができますか?ここで角材クリック可能なmd-list-itemテキストを選択可能にする
コードです:
md-list-item内のテキストを選択可能にしたい。しかし、要素のng-clickが設定されていると、行全体がボタンになり、ユーザーが要素のテキストを選択できなくなることがわかりました。どのように私はこの機能をオーバーライドすることができますか?ここで角材クリック可能なmd-list-itemテキストを選択可能にする
コードです:
これは醜いになるだろう。 ng-clickが表示されたら、各行の上にボタンを生成し、各フィールドに 'user-select:none'を追加します。それが選択できない理由です。
実際に選択可能にしたい場合は、フィールドにz-indexを設定して前面に表示し、user-select:を設定して選択可能にすることができます。また、spanには動的な幅があるので、divではなくspanを使用する方が良いでしょう。
動作するはずのような何か: -
<md-list-item xxxx>
<span style="z-index:10000;user-select:text;"> Return </span>
</md-list-item>
参照例の最後のセクションhttp://codepen.io/anon/pen/WwdMwr
角度素材ドキュメントでこの動作を指定しませんでした。しかし、md-list-itemにng-click="false"
を追加することもできます。
<md-list-item ng-click="false">
<span>...</span>
<a ng-click="f()">...</a>
</md-list-item>