An example for Vincent.

my-app.html

<dom-module id="my-app">
  <template>
    
    <page-title base-title="My App" page-title="[[pageTitle]]"></page-title>
    
    <iron-pages id="pages" attr-for-selected="name"
      selected="{{selectedPage}}"
      on-selected-item-changed="_selectedPageElementChanged"
      on-update-page-title="_updatePageTitle">
      
      <my-page-1 name="page1"></my-page-1>
      <my-page-2 name="page2"></my-page-2>
      
    </iron-pages>
  </template>
  <script src="./my-app.js"></script>
</dom-module>

my-app.js

class MyApp extends Polymer.Element {
  static properties() {
    return {
      pageTitle: {
        type: String
      },
      selectedPage: {
        type: String,
        value: "page1"  // Just by default.
      }
    };
  }
  
  _selectedPageElementChanged(newVisiblePageElement) {
    // This handler is executed when the currently visible page in `iron-pages` changes.
    // Here we want to update the `pageTitle` with whatever the page element currently 
    // says it should be. We have to do this otherwise it would not update as you move 
    // around the app. This is the simplest way to do this.
    this.pageTitle = newVisiblePageElement.title;
  }
  
  _updatePageTitle(event) {
    // This handler is executed when the `iron-pages` element notices a `update-page-title` event. 
    // I set this listener up on line 8 of `my-app.html`.
    const {pageTitle} = event.detail;  // This is the new `pageTitle` the page wants.
    const pageElement = event.target;  // This is the page element that triggered the event.
    
    // Because all of the page elements inside `iron-pages` are instantiated (not just the one 
    // visible) it's possible for them to be responding to and dispatching events even if they 
    // are not visible. In the case of page titles we don't want a page that isn't actually 
    // visible to the user to make changes to the `pageTitle`.
    
    // To prevent this, we'll confirm that the `update-page-title` event we're responding to here 
    // is from the current page:
    if (pageElement == this.$.pages.selectedItem) {
      this.pageTitle = pageTitle;
    }
    
    // With both this and the `_selectedPageElementChanged()` handler above we are capturing all 
    // the cases where the `pageTitle` can be changed by the pages, notably:
    // 
    // - The pageTitle is updated when the app switches between pages
    // - The pageTitle can be updated at any time by the currently visible page.
  }
}

customElements.define("my-app", MyApp);

my-page-1.js

// This is an example of the kind of interface the page elements inside `iron-pages` need to have for this to work:

class MyPage1 extends Polymer.Element {
  static properties() {
    return {
      title: {
        observer: '_titleChanged'
      }
    };
  }
  
  _exampleCallback() {
    // From any other method in your element you can just update the page title like this:
    this.title = "My page Title";
  }
  
  _titleChanged(pageTitle) {
    // I set an observer above when I declared the `title` property. This handler is called when the 
    // `title` property changes. It just automatically dispatches the `update-page-title` event with 
    // the new requested value. Importantly, this event bubbles so in the `my-app` element we can 
    // listen for this from *all* page elements with only one listener.
    this.dispatchEvent(
      new CustomEvent('update-page-title', {detail: {pageTitle}, bubbles: true})
    );
  }
}