{
"FOOD": [{
"item_name": "Starter"
}],
"DRINKS": [{
"item_name": "COKE"
}]
}
我在app.js中编写了代码
app.controller('DataCtrl', ['$scope', '$state', '$http',
function($scope, $state, $http) {$http.get('js/data.json').success ( function(data) {
$scope.FOOD = data.FOOD;
$scope.DRINKS = data.DRINKS;
})
}]);
details.html
<ion-view view-title="Menus">
<ion-content ng-controller="DataCtrl">
<ion-item ng-repeat="i in FOOD" class="item-thumbnail-left item-text-wrap item-icon-right">
<h2 class="title">{{i.item_name}}</h2>
</ion-item>
</ion-content>
</ion-view>
我可以从食物中提取所有数据,但我想要的是我想动态更改FOOD n DRINKS之间的数据。当有人点击它应该显示食物数据的食物时,当有人点击我想要的饮料{{1应该改为ng-repeat="i in FOOD"
。我怎么能做到这一点?
答案 0 :(得分:0)
我完全不明白你的问题。可能这段代码会帮助你。
当有人点击FOOD(参数=&#39; FOOD&#39;)时,$scope.array
会使用FOOD数据填充,当有人点击DRINKS时(参数=&#39;饮品&#39; ),使用DRINKS数据填充$scope.array
。
<强>控制器强>
app.controller('myCtrl', function($scope) {
$scope.parameter = "DRINKS";
$scope.data = {
"FOOD": [{
"item_name": "Starter"
}],
"DRINKS": [{
"item_name": "COKE"
}]
}
$scope.FOOD = $scope.data.FOOD;
$scope.DRINKS = $scope.data.DRINKS;
if ($scope.parameter == 'FOOD') $scope.array = $scope.FOOD;
else $scope.array = $scope.DRINKS;
});
<强>模板强>
<ion-view view-title="Menus">
<ion-content ng-controller="DataCtrl">
<ion-item ng-repeat="i in array" class="item-thumbnail-left item-text-wrap item-icon-right">
<h2 class="title">{{i.item_name}}</h2>
</ion-item>
</ion-content>
</ion-view>
Stack Overflow Demo
var app = angular.module('myApp', ['ngRoute']);
app.controller('myCtrl', function($scope) {
$scope.parameter = "DRINKS";
$scope.data = {
"FOOD": [{
"item_name": "Starter"
}],
"DRINKS": [{
"item_name": "COKE"
}]
}
$scope.FOOD = $scope.data.FOOD;
$scope.DRINKS = $scope.data.DRINKS;
if ($scope.parameter == 'FOOD') $scope.array = $scope.FOOD;
else $scope.array = $scope.DRINKS;
});
&#13;
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.4.8/angular.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/angular.js/1.4.8/angular-route.js"></script>
<div ng-app="myApp" ng-controller="myCtrl">
<div ng-repeat="i in array">
{{i.item_name}}
</div>
</div>
<script>
</script>
&#13;