0

モデルのプロパティとしてキーワードの配列があります。ここで、それをコンマ区切りの文字列として入力に表示し、ユーザーが入力したときにそれを配列に変換したいと考えています。

(ngModelChange)出力を変更する結合パイプを作成しましたが、反対方向 (カンマ区切りの文字列から文字列配列に変換) で同様の結果を得る方法がわかりません。

<input type="text" [ngModel]="model.keywords | join:', '," (ngModelChange)="model.keywords=$event">

コンポーネントにメソッドを追加してそこで実行できることはわかっていますが、この操作を多くの異なるコンポーネントで実行する必要がある場合はどうすればよいでしょうか。パイプのようにhtmlで利用できるように、いくつかの関数をangularに登録したいと思います。

たぶん、これは私が必要としているものを達成するための最良の方法ではなく、他の方向で考える必要がありますか?

他に2つの選択肢があります：

  1. そのような入力用のコンポーネントを作成するとうまくいきますが、他の（入力以外の）コンポーネントで必要になる場合があります。

  2. モデルに追加のプロパティを追加し、モデル自体が変換を担当するようにします (または、別のコンストラクターまたは何かを持つ文字列配列の代わりに、キーワードにクラスを使用します。それを角度モデルに接続する方法がわかりません)。

4

1 に答える 1

1

モデルに追加の get/set プロパティを追加するという簡単な解決策になりました。

get keywordsString(): string {
    if (this.keywords) {
        return this.keywords.join(", ");
    }
    else {
        return "";
    }
}

set keywordsString(input: string) {

    if (input !== null) {
        this.keywords = input.split(",")
                             .map(t => t.trim())
                             .filter(t => t !== "");
    }
    else {
        this.keywords = [];
    }
}

これは、コメントで提案されている ControlValueAccessor よりも単純なケースの方がはるかに簡単です (これは完全に有効ですが、この単純なケースには少し重すぎます)。それから私はちょうど使用することができ[(ngModel)]="model.keywordsString"、それは非常にうまく機能しているようです.

于 2016-10-25T07:33:08.247 に答える