0

私はこのデータ構造を持っています、検索:

{
    id: '1',
    name: 'Foo'
    service_ids:
    [
        3,
        8,
        12
    ]
}

次に、上記の service_ids の ID と以下の ID を一致させる別のデータ構造、services があります。

[
    {
        id: 3,
        name: 'Fighter'
    },
    {
        id: 4,
        name: 'Typhoon'
    },
    {
        id: 8,
        name: 'Kung'
    },
    {
        id: 12,
        name: 'Builder'
    }
]

これをAngularJSを使ってフォームに表示したい。名前はいいです。可能なすべてのサービスをチェックボックスとして表示したいのですが、検索でいずれかのサービスがチェックされている場合は、チェックボックスにチェックが入っています。何かのようなもの:

<li ng-repeat="search in searches">
    <input ng-model="search.name">
    <ul>
        <li ng-repeat="service in services">
            <input type="checkbox">
            {{service.name}}
        </li>
    </ul>
</li>

そのチェックボックスをservice_idsとサービスにリンクする方法がわかりません。どんな助けでも感謝します。

$リソースを使用しています。

4

2 に答える 2

1

アップデート

私の答えを無視してください。ネスティング要求を読み間違えてください。

ネスティングのガイダンスが必要な場合は、以下を参照してください。

私が見つけたAngularでネストする最良の方法は、次のような子アイテムを認識するテンプレートを作成することです:

<script type="text/ng-template"  id="tree_item_renderer.html">
 <span>{{tag.Name}}</span>
   <ul ng-show="tag.Children.length > 0">
        <li ng-repeat="tag in tag.Children" ng-include="'tree_item_renderer.html'" ></li>
   </ul>
</script>

<ul class="tag-list">
      <li ng-repeat="tag in tags" ng-include="'tree_item_renderer.html'" ></li>
 </ul>
于 2013-07-12T11:15:53.210 に答える
0

あなたの質問を理解できれば、次のように簡単です。

<input type="checkbox" ng-model="search.service_ids[service.id]">

また、双方向バインディングも取得する必要があります。

更新しました

search.service_ids はマップではなく配列であることに気付きました。したがって、上記の解決策は正確ではありません。代わりにフィルターを使用したい場合があります。

<input type="checkbox" ng-checked="search.service_ids | contains:service.id">

それで

filter('contains', function() {
    return function(haystack, needle) {
        return haystack.indexOf(needle) >= 0;
    }
});
于 2013-07-12T11:19:38.523 に答える