angularjs - タグ入力の幅が 100% になるのを回避する方法

Question

したがって、これは Angular 入力タグプロジェクト専用の 2 部構成の質問です。

私は現在それを使用しており、それが作成する入力は入力タグ自体で幅 100% に設定されます。要素自体にあるため、私が使用する他のスタイリングをオーバーライドします (!important または js を除く)。プロジェクトをフォークする以外に、これをオフにする方法はありますか?

パート 2 は、最大タグ数に達したら、入力部分を削除できますか? 最大値に達した後も入力できるのは直感に反するようです。

score 3 · Accepted Answer

パート1

カスタム CSS クラスを使用して、デフォルトの幅を変更できます。

HTML

<tags-input ng-model="tags" class="myclass"></tags-input>

CSS

.myclass .host {
  width: 50%;
}

カスタム CSS クラスを使用して入力を非表示にすることもできます。

HTML

<tags-input ng-model="tags" ng-class="{'hide-input': tags.length > 3}"></tags-input>

CSS

.hide-input .input {
  display: none;
}

ただし、ユーザーはキーボードを使用してタグを削除できないことに注意してください。

score 0 · Accepted Answer

0

実際display:blockには幅に合わせて設定することもうまくいくようです

于 2015-07-23T13:21:03.013 に答える

score 0 · Accepted Answer

ng-tags-input別の CSS ファイルが原因で、コンポーネントの幅に関する問題に直面していました。ace.css幅の値がフォームに入力されたため、コンポーネントの幅が期待どおりに表示されませんでしたace.css。

それを解決するために、フォームの幅の値をオーバーライドする別のCSSファイルを作成しace.css、後に追加しましたace.css。現在は機能しています。

CSS

.tags {
    width: 80%;
}