AngularJS & UI-Router - How do i prevent a full page reload on URL bar change? -

setup: i'm using angularjs v1.4 ui-router v0.2.15

i have 2 sibling routes, lets call them /apple & /orange

if load app , go 'apple' - apple's view loads correctly

i can use $state.go('orange') goto orange - view reloads correctly.

'use strict';  angular.module('loadzapp', [   'ngcookies',   'ngresource',   'ngsanitize',   'ui.router',   'ui.bootstrap' ])   .config(function ($stateprovider, $urlrouterprovider, $locationprovider) {     $urlrouterprovider       .otherwise('/');      $stateprovider     .state('main', {       url: '/',       templateurl: 'app/main/main.html',       controller: 'mainctrl'     })     .state('apple', {         url: '/apple',         templateurl: 'apple.html',         controller: function ($scope) {             $scope.feedback = {}         }     })     .state('orange', {         url: '/orange',         templateurl: 'orange.html',         controller: function ($scope) {             $scope.feedback = {}         }     })      $locationprovider.html5mode(true);   }); 

problem: notice when i'm on view apple , change url in chrome touse: www.domain.com/orange - results in full page reload. load correct page, seems request should handled ui-router without full page refresh

question: how configure ui-router intercept change in chrome url bar , prevent full page reload sibling routes?