class-nox-pages-dropdown.php

<?php

class Nox_Pages_Dropdown extends WP_Customize_Control {

	public $type = 'nox-pages-dropdown';
	private $dropdown_pages;
	private $pages_links;

	public function __construct( WP_Customize_Manager $manager, $id, array $args ) {
		parent::__construct( $manager, $id, $args );
		$manager->register_control_type( 'Nox_Pages_Dropdown' );

		$this->generate_data();

	}

	public function generate_data() {

		$pages = get_pages();

		foreach ( $pages as $key => $page ) {
			$this->dropdown_pages[ $page->ID ] = $page->post_title;
			$this->pages_links[ $page->ID ] = get_permalink( $page->ID );
		}

	}

	public function json() {
		$json             = parent::json();
		$json['pages']    = $this->dropdown_pages;
		$json['links']    = $this->pages_links;

		return $json;

	}

	public function content_template() {
	?>	
		<# if( data.label ){ #>
			<label class="customize-control-title">{{{ data.label }}}</label>
		<# } #>
		<# if( data.description ){ #>
			<span class="description customize-control-description">{{{ data.description }}}</span>
		<# } #>

		<div class="epsilon-pages-dropdown-container">
			<select class="epsilon-dropdown-pages">
				<# _.each(data.pages, function(k, v){ #>
					<option value="{{{ v }}}">{{{ k }}}</option>
				<# }) #>
			</select>
		</div>

	<?php
	}

}

customizer.js

var api = wp.customize;

api.EpsilonDropdownPages = api.Control.extend( {

  ready: function() {
    var control = this,
        dropdown = control.container.find( '.epsilon-dropdown-pages' );

    console.log( control );

    dropdown.change( function(){
      var value = $(this).val();

      if ( undefined !== control.params.links[ value ] ) {
        wp.customize.previewer.previewUrl.set( control.params.links[ value ] );
      }

    });
  }

} );

// Extend epsilon logo dimension
$.extend( api.controlConstructor, {
  'nox-pages-dropdown': api.EpsilonDropdownPages
} );