我想出的***解决方案是这样的:

<div ui-view autoscroll="false"></div>

Imagine an application has a List page, such as a table showing a list of users. There is a button on each row of the table called "Edit", and when this is clicked, a right-panel appears on the right-side of the browser with the form to edit that user's contents. When the form is saved or is closed, the right-side panel disappears.

How do you get Angular UI Router to show/hide the right-side panel automatically when the edit state is entered and exited? By default, the template will be added and removed, but the container itself will still exist on the screen.

In the demo application for UI Router, the html layout had empty space allocated for all of the child states, but in the application I am building, I'd really like to hide panels if they are not being used and even slide entire screens in-and-out as states are entered and exited. I'm guessing that I'll have to make use of ng-show and ng-hide in order to do that. How do I go about this with UI Router?

Thanks!

The best solution I came up with was something like this:

<div id="rightView" ng-show="$state.current.name === 'adminCompanies.list.edit'">
    <div ui-view autoscroll="false"></div>
</div>