Javascript 如何在AngularJS 1.x中将数据从组件发送到父级
我有两个选项卡作为一个组件，其中包含一些输入字段，当我按下保存按钮时，我想获取它们的值并将其保存到服务器。问题是，SAVE函数位于Javascript 如何在AngularJS 1.x中将数据从组件发送到父级,javascript,angularjs,ecmascript-6,angularjs-components,angularjs-bindings,Javascript,Angularjs,Ecmascript 6,Angularjs Components,Angularjs Bindings,我有两个选项卡作为一个组件，其中包含一些输入字段，当我按下保存按钮时，我想获取它们的值并将其保存到服务器。问题是，SAVE函数位于索引.js（父项）中，输入字段位于TestComponent.js中。我无法找到从组件获取值并将其发送到父控制器（indexController.js）的方法 例如，我还尝试使用将所有数据保存为对象，并将对象发送到indexController.js，但不幸的是，我没有成功 还请看一看示例中的 有人能帮我吗 index.html <body ng-app="he
索引.jsTestComponent.jsindexController.js<body ng-app="heroApp">
<div ng-controller="MainCtrl as vm">
<!-- Component Started -->
<md-tabs>
<tab-component> </tab-component>
</md-tabs>
<!-- Component Ended -->
<button type="submit" ng-click="save()"> Save </button>
</div>
</body>
<!-- Upload Tab-->
<md-tab id="picTab" label="Pic">
<div layout-gt-xs="row" layout-align="start center">
<md-input-container style="padding-left: 0">
<md-button>
<md-icon class="material-icons">attach_file</md-icon>
</md-button>
</md-input-container>
</div>
</md-tab>
<!-- Info Tab-->
<md-tab id="infoTab" label="Info">
<md-content class="md-margin">
<div layout-gt-sm="row">
<!-- Name -->
<md-input-container>
<label>Name</label>
<input ng-model="vm.data.name" name="name" required>
</md-input-container>
<!-- Title -->
<md-input-container class="md-block" flex-gt-sm>
<label>Title</label>
<input ng-model="vm.data.title" name="title" required>
</md-input-container>
</div>
<!-- Description field -->
<div layout="row">
<md-input-container class="md-block" flex-gt-sm>
<label>Description</label>
<textarea ng-model="vm.data.description" name="descriptionField" rows="1"></textarea>
</md-input-container>
</div>
</md-content>
</md-tab>
<body ng-app="heroApp">
<div ng-controller="MainCtrl as vm">
<!-- Component Started -->
<md-tabs>
<tab-component> </tab-component>
</md-tabs>
<!-- Component Ended -->
<button type="submit" ng-click="save()"> Save </button>
</div>
</body>
<!-- Upload Tab-->
<md-tab id="picTab" label="Pic">
<div layout-gt-xs="row" layout-align="start center">
<md-input-container style="padding-left: 0">
<md-button>
<md-icon class="material-icons">attach_file</md-icon>
</md-button>
</md-input-container>
</div>
</md-tab>
<!-- Info Tab-->
<md-tab id="infoTab" label="Info">
<md-content class="md-margin">
<div layout-gt-sm="row">
<!-- Name -->
<md-input-container>
<label>Name</label>
<input ng-model="vm.data.name" name="name" required>
</md-input-container>
<!-- Title -->
<md-input-container class="md-block" flex-gt-sm>
<label>Title</label>
<input ng-model="vm.data.title" name="title" required>
</md-input-container>
</div>
<!-- Description field -->
<div layout="row">
<md-input-container class="md-block" flex-gt-sm>
<label>Description</label>
<textarea ng-model="vm.data.description" name="descriptionField" rows="1"></textarea>
</md-input-container>
</div>
</md-content>
</md-tab>
由于主控制器中触发了
savevm.databindings: {
data: '=',
}
选项卡组件 <tab-component data="vm.data"> </tab-component>
vm.data最好将相关代码粘贴到链接之外的此处。您可以从子组件广播事件，父组件将收听该事件，此链接可能会对您有所帮助。