Привязать значение к свойству объекта, в объекте, в массиве, AngularJS

Хорошо, вот рассол:

Я использую ng-repeat для перебора пунктов меню:

<!-- start the list/loop -->
<ion-list ng-repeat="this in menuItems.items track by $index" type="item-text-wrap">

    <a class="item" ng-click="addToCart({{this}})">{{this.name}}
        <span class="badge badge-stable">{{theCart[$index].product.qty}}</span>
    </a>

</ion-list>
<!-- end the list/loop -->

Проблема возникает, когда я пытаюсь получить значение из элемента в корзине 'theCart[$index].product.qty', поскольку $index не привязан к какому-либо конкретному элементу, а только к положению в массиве. Мне нужно добраться до уникального идентификатора 2 объекта глубоко в массиве, чтобы я мог быть уверен, что получу правильные значения с двусторонней привязкой данных, которую так приятно предоставить Angular.

theCart: [{
    product: {
        id: 1,
        section: 'sides',
        name: 'mayo',
        price: 7,
        outOfStock: '',
        qty: 1
    }
}, {
    product: {
        id: 0,
        section: 'sides',
        name: 'ranch',
        price: 6,
        outOfStock: '',
        qty: 1
    }
}];

Заранее спасибо за любую информацию.


javascript deep-linking angularjs angularjs-ng-repeat 2-way-object-databinding
person user3865639    schedule 05.09.2014    source источник
comment
В чем именно проблема? this.id не будет работать?   -  person pixelbits    schedule 05.09.2014

Ответы (1)


arrow_upward
0
arrow_downward

Я не уверен, правильно ли я понял ваш вопрос.

Но предположим, что menuItems.items — это массив продуктов, элементы которого по какой-то причине не имеют свойства qty, а theCart — это другой массив продуктов, элементы которого имеют свойство qty. И что вы хотите, так это получить доступное количество продукта, который вы повторяете, из массива theCart, вы можете сделать это, используя фильтр 'фильтр', например:

<ion-list ng-repeat="item in menuItems.items" type="item-text-wrap">
    <a class="item" ng-click="addToCart(item.id)">{{item.name}}
        <span class="badge badge-stable">
           {{(theCart | filter:{product:{id:item.id} })[0].product.qty}}
        </span>
    </a>
</ion-list>

Я должен сказать, что это очень некрасивый способ, я бы никому не рекомендовал делать это так. Было бы гораздо лучше сгенерировать "объединенный массив" из этих двух массивов в контроллере и вместо этого выполнить итерацию этого "объединенного массива".

person Josep    schedule 05.09.2014
comment
Спасибо. Я согласен, что это выглядит довольно некрасиво. Я думаю, что я просто реорганизую структуру массива, чтобы она представляла собой один массив «меню []» с логическими свойствами «корзина: 0» и «корзина: 1». Похоже, это будет способ Angular, поскольку он будет использовать двустороннюю привязку данных в его наиболее очищенной форме. Минимум кода для получения результата. Согласовано? - person user3865639; 05.09.2014