Question

我是棱角分明的新人。我正在尝试使用ng-repeat显示品牌列表。它工作正常。但是，当我点击下一个按钮时，它也应该更改accorading数组索引。它不适合我。请帮我解决这个问题。并告诉最好的方式结构这种类型的情况。我的代码在下面

var data = [{“Measure”：“Measure1”，“Flavors”：[{“FlavourName”：“flavourname1”，“TotalBrands”：[{“BrandName”：“Brand1”}，{“BrandName”： “Brand2”}]}，{ “FlavourName”： “flavourname2”， “TotalBrands”：[{ “名优产品”： “Brand3”}，{ “名优产品”： “Brand4”}]}]}]; var myApp = angular.module（“survey”，[]）;

<body>
    <div ng-app="survey">
        <div ng-controller="DataController">
            <button ng-click="getPreviousFlavour()">Previous</button>
            <p>Flavour Count {{flavourCount}}</p>
            <p>Measure : {{surveyList[measureCount].Measure}}</p>
            <p> Flavours Name : {{flavours[flavourCount].FlavourName}}</p>
            <p>All Brands</p>
            <div ng-repeat="brand in totalBrands">
                <p>{{brand.BrandName}}</p>
            </div>
            <button ng-click="getNextFlavour()">Next</button>
        </div>
    </div>
</body>

    myApp.controller("DataController",['$scope',function($scope){
$scope.name = "sajid";
$scope.measureCount = 0;
$scope.flavourCount = 0;
$scope.surveyList = data;
$scope.listLength = $scope.surveyList.length;
$scope.flavours = $scope.surveyList[$scope.measureCount].Flavours;
$scope.totalBrands = $scope.flavours[$scope.flavourCount].TotalBrands;


$scope.getPreviousMeasure = function(){
    if($scope.measureCount === 0){
        $scope.measureCount = 0;
    }else{
        $scope.measureCount = $scope.measureCount - 1;  
    }
};
$scope.getNextMeasure = function(){
    if($scope.listLength-1 === $scope.measureCount){
        $scope.measureCount = 0;
    }else{
        $scope.measureCount = $scope.measureCount + 1;  
    }
};

$scope.getPreviousFlavour = function(){

    if($scope.flavours === 0){
        $scope.measureCount = $scope.measureCount - 1;
        $scope.flavourCount = 0;
    }else{
        $scope.flavourCount = $scope.flavourCount -1;   
    }
};

$scope.getNextFlavour = function(){
    if($scope.flavours.length  === $scope.flavourCount){
        $scope.measureCount = $scope.measureCount + 1;
        $scope.flavourCount = 0;
    }else{
        $scope.flavourCount = $scope.flavourCount + 1;  
    }

};

}]）;

Answer 1

getPreviousFlavour和getNextFlavour的最后一行你应该插入

$scope.totalBrands = $scope.flavours[$scope.flavourCount].TotalBrands;

这会更新totalBrands。

$scope.getPreviousFlavour = function(){

    if($scope.flavours === 0){
        $scope.measureCount = $scope.measureCount - 1;
        $scope.flavourCount = 0;
    }else{
        $scope.flavourCount = $scope.flavourCount -1;   
    }
    $scope.totalBrands = $scope.flavours[$scope.flavourCount].TotalBrands;
};

$scope.getNextFlavour = function(){
    if($scope.flavours.length  === $scope.flavourCount){
        $scope.measureCount = $scope.measureCount + 1;
        $scope.flavourCount = 0;
    }else{
        $scope.flavourCount = $scope.flavourCount + 1;  
    }
    $scope.totalBrands = $scope.flavours[$scope.flavourCount].TotalBrands;  
};

基于控制器模型的角度更新ng-repeat

1 个答案: