UI選択から選択したデータをタグ入力に渡すにはどうすればよいですか？

Question

UI選択からタグ入力にデータを送信したいと思います。 たとえば、UI-Selectから値を選択すると、タグ入力がNG-MODELで値を受け取ることを願っています。ここで

はコードです：

<ui-select ng-model="member.selected" theme="bootstrap"> 
    <ui-select-match placeholder="Select....">{{$select.selected.member_name}}</ui-select-match> 
    <ui-select-choices repeat="member in members | filter: $select.search"> 
    <div ng-bind-html="member.member_name | highlight: $select.search"></div> 
    <small ng-bind-html="member.member_email | highlight: $select.search"></small> 
    </ui-select-choices>  
</ui-select> 

<tags-input ng-model="{{$select.selected.member_name}}"> 
</tags-input> 

私が働いてしまうのタグ入力でNG-モデルで{{$のselect.selected.member_name}}置くと思ったが、それは何も受信しません。

問題は何ですか？私を助けてください！

Answer 1

更新：複数選択のための新しい要件に基づいて

、以下のフィドルを確認してください。あなたもいけない、この要件については

JSFiddle

複数選択のための問題がないので、とにかくUI選択の出力は、アレイとNG-タグ入力にも期待し配列されているので、ディレクティブを必要としています。

最初の答え：返事が遅れのために、あなたのコードの問題は<tags-input>ニーズが<ui-select>と同じng-modelを持っているということでしたが、キャッチ、NG-タグ入力要素が期待している

申し訳ありませんリスト。この問題に対する私の解決策は、parsersを追加してngモデルをリストに変換してから、ng-tags-inputにdisplayプロパティをmember_name、keyプロパティをmember_emailに設定する必要があります。

<tags-input ng-model="member.selected" display-property="member_name" key-property="member_email"></tags-input>

実施例とフィドルの下に見つけてください。

JSFiddle

また、構文解析を行いディレクティブは次のようになります。

app.directive('formatModel', function(){ 
    return{ 
     restrict: 'A', 
     require: 'ngModel', 
     link: function(scope, element, attr, ngModel){ 
      ngModel.$parsers.push(function(value){ 
       return [value]; 
      }); 
     } 
    }; 
}); 

これがあなたの問題を解決することを願っています。

Answer 2

$ selectスコープの問題はui-selectタグの中にしかないので、$ selectはタグ入力で定義されていないのでモデル名を必要としますので、$ selectを削除して試してみてください。

<tags-input ng-model="{{selected.member_name}}"></tags-input>