@nicolasbryne wrote:
Hello.. I am a new user to Ionic Framework. Help me pls..
My app will have two pages.. home and detail view(in my case "state1"). these two are template called into index.
Home page will fetch data from json containing Name and Year. When I click on one Name, it will go to detail view and fetch again json from remote url like (http://www.url.com/?t=Name) and get others informations of NAME.
I use one controller for home to get json and another controller for detail view.
I can fetch json data for detail view but i can't show it in detail view page.. help me how to solve
THANKS
Here is my code:index.html
<body ng-app="starter"> <ion-nav-view></ion-nav-view> </body> <script id="templates/home.html" type="text/ng-template"> <ion-view title="Home"> <ion-content padding="true"> <center> <div class="row"> <div class="col text-center"> <a href="#/state1"><img src={{names[0].img}} width="100%" class="thumb" ng-click='detail(names[0].Title)' ng-controller="myjson"></a><br> {{ names[0].Title }} <br> {{ names[0].Year }} </div> <div class="col text-center"> <img src={{names[1].img}} width="100%" class="thumb" ng-click='detail(names[1].Title)'><br> {{ names[1].Title }} <br> {{ names[1].Year }} </div> </div> <div class="row"> <div class="col text-center"> <img src={{names[2].img}} width="100%" class="thumb" ng-click='detail(names[2].Title)'><br> {{ names[2].Title }} <br> {{ names[2].Year }} </div> <div class="col text-center"> <img src={{names[0].img}} width="100%" class="thumb" ng-click='detail(names[0].Title)'><br> {{ names[0].Title }} <br> {{ names[0].Year }} </div> </div> <div class="row"> <div class="col text-center"> <img src={{names[1].img}} width="100%" class="thumb" ng-click='detail(names[1].Title)'><br> {{ names[1].Title }} <br> {{ names[1].Year }} </div> <div class="col text-center"> <img src={{names[2].img}} width="100%" class="thumb" ng-click='detail(names[2].Title)'><br> {{ names[2].Title }} <br> {{ names[2].Year }} </div> </div> </center> <p><a href='#/state1' nav-transition="android">Love</a> </ion-content> </ion-view> </script> <script id ="templates/state1.html" type="text/ng-template" ng-controller="myjson"> <ion-view title="State1"> <ion-content padding="true"> <div ng-controller="myjson"> Testaaa {{tite.Title}} <br> {{tite.Year}} <br> Hello </div> </ion-content> </ion-view> </script>app.js
var app = angular.module('starter', ['ionic']) app.config(function($stateProvider, $urlRouterProvider) { $urlRouterProvider.otherwise('/') $stateProvider .state('home', { url: '/', templateUrl: 'templates/home.html',controller: 'test'}) .state('state1', {url: '/state1', templateUrl: 'templates/state1.html',controller: 'myjson'}) }); app.controller('test', function($scope, $http){ $http.get("http://localhost/list.json") .success(function (response) { $scope.names = response; }); }); app.controller('myjson', function($scope, $http) { $scope.detail = function(click){ alert('Clicked: '+click) $http.get("http://localhost/list1.json") .success(function (responses) { //$scope.namea = ; $scope.tite = responses; //alert(responses["Year"]) }); } });my json files
list.json
[{"Title" : "Frozen", "Year" : "2003", "img":"http://ia.media-imdb.com/images/M/MV5BMTQ1MjQwMTE5OF5BMl5BanBnXkFtZTgwNjk3MTcyMDE@.V1SX300.jpg"} , {"Title" : "Furious 7", "Year" : "2015", "img" : "http://ia.media-imdb.com/images/M/MV5BMTQxOTA2NDUzOV5BMl5BanBnXkFtZTgwNzY2MTMxMzE@.V1SX300.jpg"}, {"Title" : "San Andreas", "Year" : "2015", "img":"http://ia.media-imdb.com/images/M/MV5BNjI4MTgyOTAxOV5BMl5BanBnXkFtZTgwMjQwOTA4NTE@.V1SX300.jpg"}]list.json
{"Title" : "Frozen", "Year" : "2003"}
Posts: 1
Participants: 1