Javascript 表中新文档中AngularJS中的自动填充值
因此,我正在进行一个项目,其中有一个表,其中包含我们服务的不同实例,每一行都有一个信息按钮,该按钮可以从自动填充的行中提取一个表单 问题: 当我获取行的值时,页面已经呈现,因此我似乎无法自动填充信息 我想要什么: 显示表单时,输入字段将从该行的表中的值填充 代码被缩短了,我只想发布必要的内容 代码: InfoForm.htmlJavascript 表中新文档中AngularJS中的自动填充值,javascript,html,angularjs,web,Javascript,Html,Angularjs,Web,因此,我正在进行一个项目,其中有一个表,其中包含我们服务的不同实例,每一行都有一个信息按钮,该按钮可以从自动填充的行中提取一个表单 问题: 当我获取行的值时,页面已经呈现,因此我似乎无法自动填充信息 我想要什么: 显示表单时,输入字段将从该行的表中的值填充 代码被缩短了,我只想发布必要的内容 代码: InfoForm.html <form name="info_change_request_form"> <div > <md-input-contain
<form name="info_change_request_form">
<div >
<md-input-container class="md-block">
<label>Name</label>
<input maxlength="255" type="text" name="name" ng-model="info_request.name" required="true"/>
</md-input-container class="md-block">
</div>
<div>
<md-input-container class="md-block">
<label>Email</label>
<input maxlength="255" type="email" name="email" ng-model="info_request.email" required="true"/>
</md-input-container class="md-block">
</div>
<div>
<md-input-container class="md-block">
<label>Summary</label>
<input maxlength="255" type="text" name="summary" ng-model="info_request.summary" rows="5" required="true"/>
</md-input-container class="md-block">
</div>
<tbody md-body>
<tr md-row ng-repeat="info in infos">
<td md-cell>{{info.name}}</td>
<td md-cell>{{info.email}}</td>
<td md-cell>
<md-menu md-position-mode="target-right target" flex="50">
解决方案是在从服务器获取数据后显示对话框:
$http.get(api_url).then(function(data) {
$mdDialog.show({
locals:{dataToPass: data.infos},
templateUrl: 'your_template_url',
controller: InfoController,
});
}
在InfoController中:
function InfoController ($scope, dataToPass) {
$scope.infos = dataToPass
}
不过,此时,数据已经从api请求接收到并在表中显示,因此我尝试使用已经接收到的数据来处理它。您可以使用observer模式。创建一个回调函数来更新绑定到视图的变量。当您收到行数据时,调用此回调。有任何示例吗?我理解观察者模式,但不知道如何为AngularJ实现每次获取表的行数据时,都必须将新数据通知对话框。正确的?您可以通过两种方式实现这一点:1)使用事件:当您获取表数据时,发送一个传递行数据的事件。在对话框控制器中,您获得该事件并将数据放入范围中。2) 使用观察者模式:在对话框控制器内创建回调。创建一个服务并在内部存储回调和“notify”和“register”方法。在对话框控制器内,您调用寄存器(回调)。获取表数据后,调用notify函数。
function InfoController ($scope, dataToPass) {
$scope.infos = dataToPass
}