[解決済み] angularjsで改行を保持する
2022-04-15 12:18:54
質問
私が見たのは これ SOの質問です。
の代わりに私のコード
ng-bind="item.desc"
は
{{item.desc}}
を持っているからです。
ng-repeat
を前にしています。
そこで私のコード。
<div ng-repeat="item in items">
{{item.description}}
</div>
項目の説明には
\n
はレンダリングされない改行のため。
どのようにすれば
{{item.description}}
があると仮定して、簡単に改行が表示されます。
ng-repeat
上記?
解決方法は?
pilau さんの回答に基づいています - しかし、受け入れられた回答でさえ持っていない改良があります。
<div class="angular-with-newlines" ng-repeat="item in items">
{{item.description}}
</div>
/* in the css file or in a style block */
.angular-with-newlines {
white-space: pre-line;
}
この場合、改行と空白は指定通りに使用されますが、コンテンツの境界でコンテンツが分割されます。ホワイトスペースの詳細については、こちらを参照してください。
https://developer.mozilla.org/en-US/docs/Web/CSS/white-space
改行で改行しつつ、複数の空白やテキストの前の空白も崩さないようにしたい場合(コードのレンダリングなどのため)。
white-space: pre-wrap;
レンダリングモードの違いを見事に比較しています。 http://meyerweb.com/eric/css/tests/white-space.html
関連
-
[解決済み] プリフライト応答が成功しない
-
[解決済み] Jasmineの "callThrough "と "callFake() "の実用的な例が欲しい
-
[解決済み] AngularJSでデータバインディングはどのように機能するのですか?
-
[解決済み] AngularJSを使用して、ブラウザのコンソールで$scope変数にアクセスするにはどうすればよいですか?
-
[解決済み] AngularJSで$scope.$watchと$scope.$applyを使用するにはどうすればよいですか?
-
[解決済み] AngularJS コントローラにおける 'this' と $scope の比較
-
[解決済み] AngularJSのng-repeatでキーと値を反復処理する方法は?
-
[解決済み] 条件に応じて特定のルートにリダイレクトする機能
-
[解決済み] AngularJS 。非同期データでサービスを初期化する
-
[解決済み】AngularJSのディレクティブスコープにおける「@」と「=」の違いは何ですか?
最新
-
nginxです。[emerg] 0.0.0.0:80 への bind() に失敗しました (98: アドレスは既に使用中です)
-
htmlページでギリシャ文字を使うには
-
ピュアhtml+cssでの要素読み込み効果
-
純粋なhtml + cssで五輪を実現するサンプルコード
-
ナビゲーションバー・ドロップダウンメニューのHTML+CSSサンプルコード
-
タイピング効果を実現するピュアhtml+css
-
htmlの選択ボックスのプレースホルダー作成に関する質問
-
html css3 伸縮しない 画像表示効果
-
トップナビゲーションバーメニュー作成用HTML+CSS
-
html+css 実装 サイバーパンク風ボタン
おすすめ
-
[解決済み] オブジェクトと選択機能を備えたAngularJS BootstrapUI Typeahead
-
[解決済み] select 要素のデフォルト値を設定するための ng-option の使用方法
-
[解決済み] Angular ng-repeat エラー "リピータ内の重複は許可されません。"
-
[解決済み] AngularJSの.$uibModalとは何ですか?
-
[解決済み] Angular UI-Routerのマルチビュー
-
[解決済み] ng-repeat内で$indexを使用して、クラスを有効にしてDIVを表示するにはどうすればよいですか?
-
[解決済み] md-selectでデフォルト値を設定する方法
-
angularでのng-repeatとtrack by
-
[解決済み] Angular JSによるシンプルなポップアップ
-
[解決済み] ng-classを使った複数クラスの追加