3

ui-gmap-markersディレクティブ (の複数形)をネストすることは可能ui-gmap-markerですか?

たとえば、次のデータ構造があります。

vm.states = [{
        id: 1,
        name: 'California',
        location: {
            latitude: 36,
            longitude: -119
        },
        cities: [{
        id: 1,
            name: 'Los Angeles',
            location: {
                latitude: 33.75,
                longitude: -118
            }
        }, {
        id: 2,
            name: 'San Francisco',
            location: {
                latitude: 38,
                longitude: -123
            }
        }, {
        id: 3,
            name: 'San Diego',
            location: {
                latitude: 32.5,
                longitude: -117
            }
        }]
    }, {
        id: 2,
        name: 'Nevada',
        location: {
            latitude: 39,
            longitude: -117
        },
        cities: [{
        id: 4,
            name: 'Las Vegas',
            location: {
                latitude: 36,
                longitude: -115
            }
        }, {
        id: 5,
            name: 'Reno',
            location: {
                latitude: 39,
                longitude: -119
            }
        }]
    }];

各州に関連付けられている都市を表示したいので、次のようにします。

<ui-gmap-markers models="vm.states">
     <ui-gmap-markers>

可能であれば、ネストされたディレクティブの「モデル」属性に何を使用しますか?

ng-repeatwithを使用してこれを行うことができましたui-gmap-marker。ただし、パフォーマンスの問題がいくつかあるため、複数形のディレクティブを使用したいと考えています。

単一バージョンのディレクティブで ng-repeat を使用したバージョンのJSFiddle (ui-gmap-marker)

ディレクティブの複数バージョンを使用したバージョンのJSFiddleui-gmap-markers ( )。ui-gmap-markers都市に使用したい入れ子に注意してください親からモデルにアクセスする方法がわかりません。

4

2 に答える 2

3

lodash を使用して都市を表示することができました (依存関係は jsfiddle で既に設定されています)。

ここで jsfiddle

コーディングは次のとおりです。

    vm.cities = _.reduceRight(vm.states, function(listCities, other) {
  return listCities.concat(other.cities);
}, []);

このコードを$watch()またはに入れることを想像できますwatchCollection()

お役に立てば幸いです

于 2015-03-11T03:23:41.570 に答える