从角度组件获取数据

时间:2017-06-02 22:03:21

标签: angularjs components

Angular 1.5

我创建的组件实际上只是几个字段的形式。每个字段都通过ng-model

查看模型

在主页面上,用户可以动态添加我的组件的多个示例。 有没有办法通过按下一个按钮从页面上的所有组件模型获取数据?

我尝试将回调函数添加到应返回组件模型数据的组件中。但它只有在页面上有一个组件时才有效。当用户添加更多内容时,没有任何内容返回到父控制器。

感谢您的回复。

2 个答案:

答案 0 :(得分:0)

您可以在parameter中传递button或在ng-submit标记中使用form,然后在按钮功能控制器中传递param参数。< / p>

喜欢这个

<form>
 <input type="text" ng-model="param.user">
 <button ng-click="click(param)">click</button>
</form> 

或者您可以通过ng-submit

来完成
<form ng-submit="click(param)">
   <input type="text" ng-model="param.user">
   <button>click</button>
</form> 
控制器中的

: -

$scope.click = function(param) {
  console.log(param) // will return the input value
}

至少这是我理解你的问题的方式。虽然您应该提供您迄今为止尝试过的代码,以便人们可以看到错误。

答案 1 :(得分:0)

以下是其他论坛的答案 https://plnkr.co/edit/0PPwLq2SjKwVJWYpldgU?p=preview

var app = angular.module('plunker', []);

app.controller('MainCtrl', function($scope) {
  this.children = [];

  this.addChild = instance => {
    console.log(instance);
    this.children.push(instance);
  }

  this.getChildValue = function() {
    console.log(this.children);
  }

});


app.component('myComponent', {
  bindings: {
    addChild: '<'
  },
  controller: function MyComponentCtrl() {

    this.name = '';
    this.surname = '';

    this.addChild(this);

  },
  template: `
    <input type='text' ng-model='$ctrl.name' placeholder='Enter name' />
    <input type='text' ng-model='$ctrl.surname' placeholder='Enter surname' />
  `
});

请将此处留在此处,万一有人遇到同样的问题 对不起,如果我的描述不是很清楚