AngularJS - 页面之间传递数据 [英] AngularJS - Passing data between pages

问题描述

我是一个AngularJS首发。我想从发送数据：

• 页答：凡上市页

  到



• 网页B：凡更新页

当用户点击了一辆面包车中的更新链接，我调用控制器和检索控制器面包车细节。但是，我不能分配面包车细节页面B（范更新页）使用相同的控制器...错误不能设置属性未定义vanNumber'

  ***页答：凡****名单＆LT;表格名称=listVanForm＆GT;
   ＆LT;表＆gt;
   ＆所述; TR＆GT; ＆LT; TD NG控制器=VanUpdateCtrl＆GT;＆LT; A HREF =＃/面包车更新NG点击=prePopulateForm（row.members.vanNumber.value）级=BTN BTN小BTN-初级＆GT;更新＆LT; / A＆GT;＆LT; / TD＆GT; ＆LT; / TR＆GT;
   ＆LT; /表＆gt;
＆LT; /表及GT;***网页B：凡更新****  ＆LT; D​​IV CLASS =容器＆GT;
        ＆LT; H2＆gt;编辑范＆LT; / H＆GT;        ＆LT;表格名称=updateVanFormNOVALIDATE =NOVALIDATE级=形横NG提交=updateCard（FORMDATA）＆GT;
            ＆LT; D​​IV CLASS =控制组＆GT;
                ＆LT;标签类=控制标签＆GT;凡编号：LT; /标签＆gt;                ＆LT; D​​IV CLASS =控制＆GT;
                    ＆LT;输入类型=文本ID =vanNumberNG模型=formData.vanNumber占位符=/＆GT;
                ＆LT; / DIV＆GT;
            ＆LT; / DIV＆GT;
        ＆LT; /表及GT;
     ＆LT; / DIV＆GT;*** VanUpdateCtrl **   app.controller（'VanUpdateCtrl'，['$范围，VanUpdateFactory'，'$位置'，
                                      功能（$范围，VanUpdateFactory，$位置）{        //回调NG-INIT'populateDD：
        $范围。prePopulateForm =功能（cardNoParam米）{            警报（'cardNo ='+ cardNoParam）;            $ scope.formData.cardNumber = cardNoParam;}
    }所以，$ scope.formData.cardNumber或$ scope.formData在目标页面无法识别。
 

解决方案

您需要创建一个服务能够控制器之间共享数据。

  app.factory（'为myService'，函数（）{
 变种savedData = {}
 功能集（数据）{
   savedData =数据;
 }
 函数的get（）{
  返回savedData;
 } 返回{
  设置：设置，
  得到：得到
 }}）;
 

在你的控制器答：

  myService.set（yourSharedData）;
 

在您的控制器B：

  $ scope.desiredLocation = myService.get（）;
 

记住通过将其作为一个参数注入在控制器为myService。

I am an AngularJS starter. I am trying to send data from :

• Page A : Van Listing page

  to

• Page B: Van Update page.

When user click the update link for a van, I am invoking a controller and retrieving the van details in the controller. But, I cannot assign the van details to the Page B ( Van Update Page) using the same controller... Error "Cannot set property 'vanNumber' of undefined"

*** Page A: Van List ****

<form name="listVanForm" >
   <table>
   <tr> <td ng-controller="VanUpdateCtrl"><a href="#/van-update" ng-click="prePopulateForm(row.members.vanNumber.value )" class="btn btn-small btn-primary">update</a></td> </tr>
   </table>
</form>

*** Page B: Van Update ****

  <div class="container">
        <h2>Edit Van </h2>

        <form name="updateVanForm" novalidate="novalidate" class="form-horizontal" ng-submit="updateCard(formData)">
            <div class="control-group">
                <label class="control-label" >Van Number:</label>

                <div class="controls">
                    <input type="text" id="vanNumber" ng-model="formData.vanNumber" placeholder=""/>
                </div>
            </div>
        </form>
     </div>

*** VanUpdateCtrl **

   app.controller('VanUpdateCtrl', ['$scope', 'VanUpdateFactory', '$location',
                                      function ($scope, VanUpdateFactory, $location) {

        //callback for ng-init 'populateDD':    
        $scope.prePopulateForm = function (cardNoParam m) {

            alert('cardNo = '+cardNoParam);

            $scope.formData.cardNumber=cardNoParam;}
    }

So, $scope.formData.cardNumber OR $scope.formData in the destination page is not recognised.

解决方案

You need to create a service to be able to share data between controllers.

app.factory('myService', function() {
 var savedData = {}
 function set(data) {
   savedData = data;
 }
 function get() {
  return savedData;
 }

 return {
  set: set,
  get: get
 }

});

In your controller A:

myService.set(yourSharedData);

In your controller B:

$scope.desiredLocation = myService.get();

Remember to inject myService in the controllers by passing it as a parameter.

这篇关于AngularJS - 页面之间传递数据的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！