Javascript AngularJS:在一个特定JSON文件的新页面中通过点击操作显示数据
我有两个图像的缩略图视图,还有两个JSON文件(名为dataOne.JSON和dataTwo.JSON)。当用户单击其中一个图像时,我想在一个新的网页中列出相应JSON文件的所有元素。新网页有一个药丸 HTML:Javascript AngularJS:在一个特定JSON文件的新页面中通过点击操作显示数据,javascript,jquery,json,angularjs,Javascript,Jquery,Json,Angularjs,我有两个图像的缩略图视图,还有两个JSON文件(名为dataOne.JSON和dataTwo.JSON)。当用户单击其中一个图像时,我想在一个新的网页中列出相应JSON文件的所有元素。新网页有一个药丸 HTML: 如何通过单击页面1从json文件中获取数据并将其显示在新页面的页面2中?您可以定义一个保存json数据的服务工厂。请看一下类似问题的答案: 您可以使用$rootScope。将其注入到这两个控制器中。在CityController中为$rootScope创建一个变量,该变量保存您的数据,
如何通过单击页面1从json文件中获取数据并将其显示在新页面的页面2中?您可以定义一个保存json数据的服务工厂。请看一下类似问题的答案:
您可以使用$rootScope。将其注入到这两个控制器中。在CityController中为$rootScope创建一个变量,该变量保存您的数据,并再次从$rootScope获取和使用TabController。
<div id = "Cities" class = "neighborhood-guides">
<div class = "container" ng-controller="CityController">
<div class = "thumbnail" ng-click = "city(dataOne)">
<image src = "Images/NYC.jpg"/>
</div>
<div class = "thumbnail" ng-click = "city(dataTwo)">
<image src = "Images/LA.jpg"/>
</div>
</div>
</div>
<div class = "content" id = "content">
<div class="list-group-item">
<section class="tab" ng-controller = "TabController as tab">
<ul class="nav nav-pills">
<li ng-class="{ active: tab.isSet(1) }">
<a ng-click = "tab.setTab(1)" href>Categories</a>
</li>
<li ng-class="{ active: tab.isSet(2) }">
<a ng-click = "tab.setTab(2)" href>Interactive Guide</a>
</li>
<li ng-class="{ active: tab.isSet(3) }">
<a ng-click = "tab.setTab(3)" href>List of all places</a>
</li>
</ul>
<div ng-show = "tab.isSet(1)"></div>
<div ng-show = "tab.isSet(2)">
<blockquote>This is where I want the data</blockquote>
</div>
<div ng-show = "tab.isSet(3)">
<blockquote></blockquote>
</div>
</section>
</div>
</div>
function() {
var app = angular.module('app', []);
app.controller('CityController', function(){
$scope.city = function(param) {
$http.get(param+'.json', param).success(
function(data){
//What should I do here?
console.log(data);
}
).error();
}
});
app.controller('TabController', function(){
this.tab = 1;
this.setTab = function(newValue){
this.tab = newValue;
};
this.isSet = function(tabName){
return this.tab === tabName;
};
);