2017-06-02 123 views
0

Angular 1.5从角度组件获取数据

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

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

我试着给应该返回组件模型数据的组件添加回调函数。但它只有在页面上有一个组件时才起作用。当用户添加几个没有返回到父控制器。

感谢您的回复。

回答

0

您可以在button传递parameterform标签使用ng-submit,然后通过param参数在您的按钮功能控制器。

像这样

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

,或者你可以通过做在你的控制器NG-提交

<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 
} 

至少这是我的理解你的题。尽管您应该提供迄今为止尝试过的代码,以便人们可以看到出了什么问题。

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' /> 
    ` 
}); 

离开这里万一有人有同样的问题 很抱歉,如果我的描述wasn`t很清楚