Angular.jsを使用して異なるページにパラメータを渡す方法

Question

私はいくつかの助けが必要です。 Angular.jsを使って別のページに値を渡す必要があります。私は以下のコードを説明しています。

<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 ng-click="demo()" target="_blank" href="">Display Location On The Map</a> 
</div> 

ここでは、新しいタブで開いている別のページにLatitudeフィールド値を渡す必要があります。私のコントローラ側のコードを以下に示します。

var newCustomer=angular.module('Spesh'); 
newCustomer.controller('newController',function($scope,$state){ 
    $scope.demo=function(){ 
    var base_url = "index.html#" 
    var url = $state.href('map', {}); 
    window.open(base_url+url,'_blank'); 
    } 
}) 

map.html：私はvalue.My full plunkr code渡されたことを表示したい。このページで

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

はこちらです。私を助けてください。

Answer 1

ui-routerを使用している場合は、stateparametersを使用してすべての魔法を手に入れます。

いけない$state.go代わり

あなたはビューをナビゲートするui-routerの$stateParamsを使用することができますを使用して、プレーンなjavascriptのナビゲーションを使用します。

チェック、私はlatitude

state change上routes.js

var Admin = angular.module('Spesh', ['ui.router']); 
Admin.config(function($stateProvider, $urlRouterProvider, $locationProvider) { 
    $urlRouterProvider.otherwise('/'); 
    $stateProvider 
    .state('/', { 
     url: '/', 
     templateUrl: 'login.html', 
     controller: 'loginController' 
    }) 
    .state('new', { 
     url: '/new', 
     templateUrl: 'new.html', 
     controller: 'newController' 
    }) 
    .state('map', { 
     url: '/map?latitude', 
     templateUrl: 'map.html', 
     controller: 'mapController' 
    }) 
}) 

あなたmapcontroller.jsオプションのパラメータを追加しました：

var login=angular.module('Spesh'); 
login.controller('mapController',function($scope,$state,$stateParams){ 
    alert($stateParams.latitude); 
$scope.latitude = $stateParams.latitude; 
}) 

newcontroller.js ：

var newCustomer=angular.module('Spesh'); 
newCustomer.controller('newController',function($scope,$state){ 
    $scope.demo=function(){ 
    var base_url = "index.html#" 
    $state.go("map", {latitude: $scope.latitude}); 

    -------to open in a new tab------- 

    $state.go("map", {latitude: $scope.latitude}); 
    var url = $state.href('map', {latitude: $scope.latitude}); 
    window.open(url,'_blank'); 


    } 
}) 

$state.go("map", {latitude: $scope.latitude});、これはここで新しいタブで

$state.go("map", {latitude: $scope.latitude}); 
var url = $state.href('map', {latitude: $scope.latitude}); 
window.open(url,'_blank'); 

を開くには、重要なライン

は、あなたのPlunkerリンクです。

Check the changed plunker