跨控制器共享ng-repeat表单字段的数据

hap

我正在制作一张带有按钮的名片订购单,以添加另一张名片。我希望按钮创建另一个名片表单,并将表单中的所有数据与另一个视图的控制器共享。

我有两个模板连接到各自的控制器。

  • order.html,order.js
  • Confirm.html,confirm.js

代码示例:

order.js

.factory('Cards', function () {
var Cards = []

return Cards
})
.controller('TestCtrl', function ($scope, Cards) {
  $scope.person0={name: '', email:'', description:''}
  $scope.person1={name: '', email:'', description:''}
  if (Cards.length < 2) {
    Cards.push($scope.person0);
    Cards.push($scope.person1);
  }
 }

order.html

<md-toolbar layout='column' layout-align='center' ng-repeat="card in Cards">
        <md-button layout-margin layout-padding flex='100' class='md-raised md-primary'>
          <h1>{{ card.name }}</h1>
          <h1>{{ card.email }}</h1>
          <h1>{{ card.description }}</h1>
        </md-button>
        <div layout='column' layout-align='center center' >
          <input type="text" style="color:black;" flex='' ng-model="card.name">
          <input type="text" style="color:black;" flex='' ng-model="card.email">
          <input type="text" style="color:black;" flex='' ng-model="card.description">
        </div>
 </md-toolbar>

about.js

.controller('AboutCtrl', function ($scope, Cards) {
    $scope.person0=Cards[0];
    $scope.person1=Cards[1];
  });

about.html

<div ng-repeat="card in Cards">
    <md-toolbar layout='column' layout-align='center'>
      <md-button layout-margin layout-padding flex='100' class='md-raised md-primary'>
        <h1>{{card.name}}</h1>
        <h1>{{card.email}}</h1>
        <h1>{{card.description}}</h1>
      </md-button>
    </md-toolbar>
    <md-content>

    </md-content>
  </div>

我希望来自order.html的表单数据显示在confirm.html上

这两个视图都记录了Cards集合,但未显示ng-repeat模板。

AJcodez

放慢脚步,仔细看看。

about.html它看起来像你通过卡要循环。

<div ng-repeat="card in Cards">

但是在about.js每个单独的卡中都分配了作用域。

$scope.person0=Cards[0];  // no reference in template

要解决此问题,请将卡放在about.js示波器上。

$scope.Cards = Cards

本文收集自互联网,转载请注明来源。

如有侵权,请联系[email protected] 删除。

编辑于
0

我来说两句

0条评论
登录后参与评论

相关文章

来自分类Dev

如何清除动态ng-repeat表单字段

来自分类Dev

在控制器动作MVC3中获取表单字段和模型数据

来自分类Dev

在控制器动作MVC3中获取表单字段和模型数据

来自分类Dev

AngularJS在工厂和控制器之间跨模块共享数据

来自分类Dev

如何使用Angular服务跨控制器/页面共享数据?

来自分类Dev

在AngularJs中的控制器外部重置表单字段

来自分类Dev

如何在ng-repeat字段和外部ng-repeat字段的控制器中获取数据

来自分类Dev

在控制器之间共享数据[数组]

来自分类Dev

AngularJS在控制器之间共享数据

来自分类Dev

在控制器之间共享数据[数组]

来自分类Dev

在控制器AngularJS之间共享数据

来自分类Dev

在控制器之间共享数据,AngularJS

来自分类Dev

在控制器之间共享模型数据

来自分类Dev

如何从symfony 2控制器中删除嵌入式表单中的表单字段

来自分类Dev

使用ng-repeat动态表单时,验证提交时所有表单字段的正确方法是什么?

来自分类Dev

ng-model和ng-repeat的问题,输入值在页面上的每个表单字段上重复

来自分类Dev

如何跨多个控制器访问相同的数据?

来自分类Dev

从Symfony2中的控制器访问集合表单字段

来自分类Dev

如何使用模型和控制器验证cakephp中的表单字段

来自分类Dev

.net MVC控制器接收动态表单字段提交的值?

来自分类Dev

在两个子控制器之间共享父控制器的数据

来自分类Dev

angularjs:控制器不使用服务共享数据

来自分类Dev

AngularJS:在控制器之间共享数据的工厂

来自分类Dev

使用ngResource在几个控制器之间共享相同的数据

来自分类Dev

使用AngularJS工厂在控制器之间共享数据

来自分类Dev

AngularJS:在指令和外部控制器之间共享数据

来自分类Dev

Symfony 2在控制器之间共享数据

来自分类Dev

在不同页面的控制器之间共享数据。角度的

来自分类Dev

Angular:在控制器之间共享从工厂返回的数据

Related 相关文章

  1. 1

    如何清除动态ng-repeat表单字段

  2. 2

    在控制器动作MVC3中获取表单字段和模型数据

  3. 3

    在控制器动作MVC3中获取表单字段和模型数据

  4. 4

    AngularJS在工厂和控制器之间跨模块共享数据

  5. 5

    如何使用Angular服务跨控制器/页面共享数据?

  6. 6

    在AngularJs中的控制器外部重置表单字段

  7. 7

    如何在ng-repeat字段和外部ng-repeat字段的控制器中获取数据

  8. 8

    在控制器之间共享数据[数组]

  9. 9

    AngularJS在控制器之间共享数据

  10. 10

    在控制器之间共享数据[数组]

  11. 11

    在控制器AngularJS之间共享数据

  12. 12

    在控制器之间共享数据,AngularJS

  13. 13

    在控制器之间共享模型数据

  14. 14

    如何从symfony 2控制器中删除嵌入式表单中的表单字段

  15. 15

    使用ng-repeat动态表单时,验证提交时所有表单字段的正确方法是什么?

  16. 16

    ng-model和ng-repeat的问题,输入值在页面上的每个表单字段上重复

  17. 17

    如何跨多个控制器访问相同的数据?

  18. 18

    从Symfony2中的控制器访问集合表单字段

  19. 19

    如何使用模型和控制器验证cakephp中的表单字段

  20. 20

    .net MVC控制器接收动态表单字段提交的值?

  21. 21

    在两个子控制器之间共享父控制器的数据

  22. 22

    angularjs:控制器不使用服务共享数据

  23. 23

    AngularJS:在控制器之间共享数据的工厂

  24. 24

    使用ngResource在几个控制器之间共享相同的数据

  25. 25

    使用AngularJS工厂在控制器之间共享数据

  26. 26

    AngularJS:在指令和外部控制器之间共享数据

  27. 27

    Symfony 2在控制器之间共享数据

  28. 28

    在不同页面的控制器之间共享数据。角度的

  29. 29

    Angular:在控制器之间共享从工厂返回的数据

热门标签

归档