On the assumption that you have already defined $scope.pages
before you attempt to set a sub key, it should work.
If you try to set properties of $scope.pages
before it has been defined, you will simply get an error and the desired functionality will not work.
Demo Fiddle
HTML
<div ng-controller="MyCtrl">
<div ng-show="pages.quantity">quantity</div>
<div ng-show="pages.frontSelect">frontSelect</div> <a class="personalise" ng-click="updatePage('quantity','frontSelect')">
<p>Personalise Front <i class="fa fa-caret-right"></i></p></a>
</div>
Angular:
var myApp = angular.module('myApp', []);
function MyCtrl($scope) {
$scope.pages = {}; /* <---- variable defined */
$scope.updatePage = function (hide, show) {
switch (show) {
case "frontSelect":
$scope.pages.frontSelect = true;
break;
}
switch (hide) {
case "quantity":
$scope.pages.quantity = false;
break;
}
}
}
If you want the buttons to act as a toggle, you can change your Angular code to:
Demo Fiddle
var myApp = angular.module('myApp', []);
function MyCtrl($scope) {
$scope.pages = {
frontSelect:false,
quantity:true
};
$scope.updatePage = function (hide, show) {
switch (show) {
case "frontSelect":
$scope.pages.frontSelect = !$scope.pages.frontSelect;
break;
}
switch (hide) {
case "quantity":
$scope.pages.quantity = !$scope.pages.quantity;
break;
}
}
}