使用Angularjs將Click事件的值傳遞到另一個頁面

我正嘗試使用Angular將數據值從一個頁面傳遞到另一個頁面。我是Angular的新手，所以如果聽起來很傻，請耐心等待。這裏是我的HTML和Angular代碼。基本上，我希望ng-model「jobtitle」值填充在用戶點擊該div後在不同頁面上的表單中。使用Angularjs將Click事件的值傳遞到另一個頁面

HTML爲第1頁（數據源）

<div id="portfoliolist" ng-app="careerApp" ng-controller="JobList"> 
<div class="portfolio DataScience col-xs-12 col-sm-12 col-md-4 col-lg-4" data-cat="DataScience"> 
<a href="~/career-form.cshtml" class="portfolio-wrapper"> 
          <!-- Item Details --> 
          <div class="protfolio-caption-activeWrap"> 
           <!-- Centered Details --> 
           <div class="center-details"> 
            <div class="details"> 
             <!-- Item Name --> 
             <h2 class="name" ng-model="jobtitle"> 
              Winter 
             </h2> 
             <p><b>Job ID#</b> <span class="jobid" ng-model="jobid">2017-01</span></p> 
             <p ng-click="set(data)" class="btn btn-sm">Apply</p> 
             <!-- Tags --> 
            </div> 
           </div> 
           <!-- End Center Details Div --> 
          </div> 
          <!-- End Item Details --> 
         </a> 
        </div> 
</div>

HTML的第二頁（其中的數據將被複制到）

<div ng-app="careerApp" ng-controller="JobSelection"> 
            <form class="tsf-step-content"> 
             <label>{{jobtitle}}</label> 
             <label>{{jobid}}</label> 
             </form> 
</div>

角腳本

var careerApp = angular.module("careerApp", []); 
careerApp.factory('myService', function() { 
    var savedData = {} 
    function set(data) { 
     savedData = data; 
    } 
    function get() { 
     return savedData; 
    } 

    return { 
     set: set, 
     get: get 
    } 

}); 

careerApp.controller("JobList", ['$scope', function ($scope) { 
    myService.set($scope.jobtitle); 
}]); 
careerApp.controller("JobSelection", ['$scope',function ($scope) { 
    $scope.jobtitle = myService.get(); 
}]);

來源

2017-01-02 user2185457

您指定以HTML的NG-應用程序，它必須剛好每一次添加應用程序。 –

有很多方法可以實現這一點，一種共享數據btw頁面的方式是使用服務。 –

我從第二頁中刪除。仍然沒有工作 – user2185457

你錯在聲明ng-app兩次在兩個不同的頁面。傳遞數據的更簡單方法是將其存儲在$ rootScope中。

來源

2017-01-02 13:10:52 Codesingh

確實比較簡單，但是對$ rootScope極其污染...... def並不是處理數據的理想方式。 –

嘗試這樣的事情

//Controller foo 

app.controller('fooController', ['$scope', 'foobarService', function($scope, foobarService){ 
$scope.StoreId = function(id){ 
    foobarService.setId(id); 
}]); 

//foobarService 
app.service('foobarService', [function(){ 
    var id; 

    this.setId = function(id){ 
     id = id; 
    } 

    this.getId = function(){ 
     return id; 
    } 
}]); 

//Controller bar 
app.controller('barController', ['$scope', 'foobarService', function($scope, foobarService){ 
    $scope.id = foobarService.getId(); 
}]);

來源

2017-01-02 13:30:03

使用Angularjs將Click事件的值傳遞到另一個頁面

回答

相關問題