CODEWITHSUNDEEP
angularjsparametersangular-ui-router
jkg
jkg

Reputation: 5

AngularJS parameters in UI-router not showing other values

I am new to AngularJS and using UI-router. What I want to achieve is how can I access other details on my object arrays on my controller based on the id I've passed on the URL and show it to the view I have made. You can access sample code here.

In here, when the user clicked the destination, it will show the list of destinations indicated in my object array (South Cebu and Bataan) which I already achieved. Please see the code preview screenshot.

I am having a hard time to achieve when the user clicked one of the destinations displayed, it should show the destination name and the top destination names (topDesti.name).

For example, when the user clicked South Cebu, it should show South Cebu (destination name) and Sirao Flower Farm, Moalboal, Basilica Minore del Santo Niño, ... etc. (top destination names). And when the user clicked Bataan, it should show Bataan (destination name) and Mount Samat, World War II Museum (top destination names).

NOTE: I am using only destiArtiController --- destiArtiController.js, please disregard destiController.js

Please help. Thanks in advance!

Upvotes: 0

Views: 29

Answers (1)

Aleksey Solovey
Aleksey Solovey

Reputation: 4191

Ideally you would want to split your $scope.details into separate JSON files and pull those inside angular.config with resolve.

But for your code to simply work you need to add <div ui-view></div> into desti.html (outside of ng-repeat).

Then to show a specific destination, change 

<div ng-repeat="detail in details">

to 

<div ng-if="detail.id == id" ng-repeat="detail in details">

in destiArti.html

Upvotes: 1

Related Questions