javascript - 在某些其他范围对象的 ng-repeat 中使用另一个范围对象值

Question

我已经设置了一个 fiddle很好地解释我的问题。我想在 ng-repeat 中显示 $scope.gem 中的名称 [每个 ng-repeat 只有一个名称并且不要全部循环] $scope.knobItems 不扩展 knobItems 范围。我希望通过保持 Controller 现在的确切结构来实现这一点。我是 Angular 新手。我只想知道这在 Angular 上是否可行，是否是一个好习惯。

查看

<div ng-app="myapp">
    <div ng-controller="Mycont">
        <div ng-repeat="knobs in knobItems">
            <div ng-repeat="(key, value) in knobItems.nums">{{value.knobTitle}} : {{value.knobColor}}
                <div ng-bind="gem[0].name"></div>
            </div>
        </div>
    </div>
</div>  

控制者

var ngMod = angular.module("myapp", []);
ngMod.controller("Mycont", function ($scope) {
    $scope.knobItems = {};
    $scope.knobItems.nums = [{
        knobTitle: "Company Profile",
        knobColor: "#f46607"
    }, {
        knobTitle: "Deals left This Month",
        knobColor: "#ffcc00"
    }, {
        knobTitle: "Pricelist",
        knobColor: "#f40787"
    }, {
        knobTitle: "Pictures",
        knobColor: "#a1b80a"
    }, {
        knobTitle: "Videos",
        knobColor: "#14b9d6"
    }];
    $scope.gem = [{
        name: "Thomas"
    }, {
        name: "Sebastian"
    }, {
        name: "June"
    }, {
        name: "Yuvan"
    }];
});  

预期输出

Answer 1

轻松修复:fiddle

<div ng-app="myapp">
    <div ng-controller="Mycont">
        <div ng-repeat="knobs in knobItems">
            <div ng-repeat="(key, value) in knobItems.nums">{{value.knobTitle}} : {{value.knobColor}}
                <div ng-bind="gem[$index].name"></div>
            </div>
        </div>
    </div>
</div>