Master-Detail Views with AngularJs/Ionic

1

I’m trying to incorporate a detail view using AngularJs. I’m using parse as my backend to store my data. I can successfully call it back and display it. I just don’t know how to display the details in detail for a specific user. I’ve looked all over I just can’t find an example that uses parse.

Master view (master.html): (for now I’m using a button to call back the data)

<ion-view title="Master List">
<ion-content>
	<button class="button" ng-click="findPeople()">Find People</button>
	<ion-list>
		<ion-item class="item" ng-repeat="person in people">
			<a href="#/details/{{person.id}}">{{person.id}}</a>
		</ion-item>
	</ion-list>
</ion-content>
</ion-view>

Detail View (details.html):

<ion-view title="Details">
<ion-content>
	<h2>{{person.id}}</h2>
</ion-content>
</ion-view>

App.js

.config(function ($stateProvider, $urlRouterProvider) {

$stateProvider

    .state('master', {
    url: '/master',
    templateUrl: 'templates/master.html',
    controller: 'masterCtrl',
})
    .state('details', {
    url: '/details/:id',
    templateUrl: 'templates/details.html',
    controller: 'detailsCtrl',
});

$urlRouterProvider.otherwise('/master');
})

Controllers.js

.controller("masterCtrl", function($scope) {
$scope.findPeople = function () {
    var Person = Parse.Object.extend("person");
    var query = new Parse.Query(Person);

    query.find({
        success: function(results) {
           
            $scope.$apply(function() {
                console.log(results);
               $scope.people = results; 
            });
        },
        error: function(error) {
            console.log("error")
        }
    });
}


})

The URL changes accordingly to the person clicked, and it does navigate to the details.html, but nothing appears.

Thanks

2

Where is your detailsCtrl defined? In the $stateProvider you say you will use this controller, but it is nowhere defined. This detailsCtrl should have a $scope.person.

3 
.controller("detailsCtrl", function() {

})

its just this so there is no error.

4

complete example using parse https://github.com/aaronksaunders/dcww

basically use the stateParams to get the id that was passed in and query the user to display on the details page

5

Thanks, I’ll look into to that