將數據從一個HTML傳遞到另一個HTML都使用相同的角度控制器onClick

我檢索所有數據並將其存儲在變量「storedata」中，將其顯示在與角度控制器關聯的HTML視圖「A」中，我正在使用thymeleaf模板，但是在點擊ID時，我想在另一個HTML視圖「B」中顯示內容，我想使用其中已有數據的變量「storedata」。所以我嘗試將HTML視圖「B」與相同的角度控制器鏈接起來，以爲我可以直接訪問它，但是我不能。你的建議很有價值。所有文件都粘貼在下面。將數據從一個HTML傳遞到另一個HTML都使用相同的角度控制器onClick

HTML 「A」

<div data-ng-repeat="storedata in storeDataModel"> 
     <a class="clickableRow" title="Click to get User details" onclick="window.open('B.html')" >{{storedata.ID}} 
    </a> 
</div>

HTML 「B」

<div ng-controller="angularController"> 
<a> HELLO WORLD..!! {{storedata.ID}}</a> 
</div>

來源

2017-02-20 B. K.

你應該使用一個服務這樣的事情，因爲更改視圖將初始化控制器的新實例是不帶'storedata '變量 – DGarvanski

哦好吧，不知道它會創建一個角度控制器的新實例，謝謝。 –

沒有自舉也不能加載另一個視圖。通過調用窗口。打開，你只加載一個與你正在使用的角度應用程序無關的html文件。欲瞭解更多信息，請看angular bootstrapping.

另一種方法是使用ng-route或ui-router。我建議後者。

例如看看下面的代碼：

angular.module('app', ['ui.router']) 
 
    .config(function($stateProvider, $urlRouterProvider) { 
 

 
    // State definition 
 
    $stateProvider 
 
     .state('homeState', { 
 
     abstract: true, 
 
     url: '/home', 
 
     template: '<div> {{ title }} ' + 
 
      '<div ui-view><div>' + 
 
      '</div>', 
 
     controller: 'HomeController' 
 
     }) 
 
     .state('homeState.childStateA', { 
 
     url: '/stateA', 
 
     template: '<div> {{ data }} </div>' + 
 
      '<button data-ng-click="$state.go(\'homeState.childStateB\')"> Click Me To GoTo StateB </button>', 
 
     controller: 'StateAController' 
 
     }) 
 
     .state('homeState.childStateB', { 
 
     url: '/stateB', 
 
     template: '<div> {{ data }} </div>' + 
 
      '<button data-ng-click="$state.go(\'homeState.childStateA\')"> Click Me To GoTo StateA </button>', 
 
     controller: 'StateBController' 
 
     }); 
 

 
    // Default to stateA 
 
    $urlRouterProvider.otherwise('/home/stateA'); 
 
    }) 
 
    .run(function($rootScope, $state, $stateParams) { 
 
    $rootScope.$state = $state; 
 
    $rootScope.$stateParams = $stateParams; 
 
    }) 
 
    .controller('HomeController', function($scope) { 
 
    // homeState data 
 
    $scope.title = 'State example'; 
 
    }) 
 
    .controller('StateAController', function($scope) { 
 
    // StateA data 
 
    $scope.data = 'Hi State A'; 
 
    }) 
 
    .controller('StateBController', function($scope) { 
 
    // StateB data 
 
    $scope.data = 'Hi State B'; 
 
    })

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script> 
 
<script src="https://cdnjs.cloudflare.com/ajax/libs/angular-ui-router/0.4.2/angular-ui-router.min.js"></script> 
 

 
<div data-ng-app="app"> 
 
    <div ui-view></div> 
 
</div>

來源

2017-02-20 14:52:53 Gaurav

將數據從一個HTML傳遞到另一個HTML都使用相同的角度控制器onClick

回答

相關問題