How to open page in different tab using ui-router Angular.js

Question

I am using angular.js UI-ROUTER for navigating the page. Here I need to open one page in a new tab of browser. My code is below.

New.html:

    <div class="input-group bmargindiv1 col-md-12">
  <span class="input-group-addon ndrftextwidth text-right oditek-form" style="width:180px">Latitude:</span>
  <input type="text" name="latitude" id="latitude" class="form-control oditek-form" placeholder="Add Latitude coordinate" ng-model="latitude" ng-keypress="clearField('businessno');">
</div>
<div class="input-group bmargindiv1 col-md-12" ng-if=" latitude">
  <a ui-sref="map" target="_blank">Display Location On The Map</a>
</div>

Here until unless the Latitude field has no value, the above link Display Location On The Map will not display to user but here still the field has no value but its displaying to user. This is one problem. I am providing my routing file below.

.state('new', {
      url: '/new',
      templateUrl: 'new.html',
      controller: 'newController'
    })
    .state('map', {
      url: '/map',
      templateUrl: 'map.html',
      controller: 'mapController'
    })

Here I need when the user will click on that link (i.e-Display Location On The Map) the latitude value will display in map.html file.

map.html:

<div id="dvMap" style="width:1000px; height:1000px;">{{latitude}}</div>

But here when user is clicking on that link the page is not coming. It's giving the following message.

Not Found

The requested URL  was not found on this server.

Here is my plunkr code.

Answer 1

        <!--Change you HTML with below.-->

    <div class="input-group bmargindiv1 col-md-12">
        <span class="input-group-addon ndrftextwidth text-right oditek-form" style="width:180px">Latitude:</span>
        <input type="text" name="latitude" id="latitude" class="form-control oditek-form" placeholder="Add Latitude coordinate" ng-model="latitude" ng-keypress="clearField('businessno');">
    </div>
    <div class="input-group bmargindiv1 col-md-12" ng-if="latitude.length > 0">
        <a ui-sref="map" target="_blank">Display Location On The Map</a>
    </div>