我希望在关闭我的webapp中的md-dialog
后更改列表中的值。这意味着,首先您单击一行然后打开由角度材料定义的对话框。在我更改此调用对象中的值并单击"确定"值需要在列表中更新。目前itworks是异步的。在对话框视图中更改值后,在我单击" OK"。
当我使用单个变量测试我的方法时,它可以在下面的代码中看到:
//Main view:
<div class="md-padding">
<p>{{c.txtSample}}</p>
<md-button class="md-raised md-primary" ng-click="fc.openDialog(c.txtSample)">
Klick
</md-button>
</div>
//dialog view:
<div class="md-dialog-container">
<md-dialog>
<md-dialog-content class="md-dialog-content">
<md-input-container class="md-block">
<label>Sample text</label>
<input ng-model="c.textInput" />
</md-input-container>
</md-dialog-content>
<md-dialog-actions>
<md-button class="md-raised" ng-click="c.klickOK(c.textInput)">
OK
</md-button>
</md-dialog-actions>
</md-dialog>
</div>
//MainCtrl
vm.txtSample = 'Change the inputtext.';
vm.openDialog = openDialog;
function openDialog(item) {
$mdDialog.show({
parent: angular.element(document.body),
templateUrl: 'App/views/testDialog.html',
controller: function TestCtrl($scope, sampleTxt) {
var vm = this;
vm.textInput = sampleTxt;
vm.klickOK = klickOK;
function klickOK(item) {
$mdDialog.hide(item);
}
},
controllerAs: 'c',
preserveScope: true,
locals: {
sampleTxt: item
}
}).then(function (item) {
vm.txtSample = item;
}, function () {
alert('Abgebrochen');
});
}
但是对于列表值,它不起作用。我不知道为什么......这里是选定行的代码示例:
//Main view:
<div class="md-padding">
<div ng-repeat="wert in fc.werteliste track by $index">
<span flex="20">{{wert.wert1}}</span>
<span flex="20">{{wert.wert2}}</span>
<span flex="40">{{wert.wert3}}</span>
<md-button class="md-raised md-primary" ng-click="fc.openDialog(wert)">
Klick
</md-button>
</div>
</div>
//Dialog view:
<div class="md-dialog-container">
<md-dialog>
<md-dialog-content class="md-dialog-content">
<md-input-container class="md-block">
<label>Wert 1</label>
<input ng-model="c.textInput.wert1" />
</md-input-container>
<md-input-container class="md-block">
<label>Wert 2</label>
<input ng-model="c.textInput.wert2" />
</md-input-container>
<md-input-container class="md-block">
<label>Wert 3</label>
<input ng-model="c.textInput.wert3" />
</md-input-container>
</md-dialog-content>
<md-dialog-actions>
<md-button class="md-raised" ng-click="c.klickOK(c.textInput)">
OK
</md-button>
</md-dialog-actions>
</md-dialog>
</div>
//MainCtrl:
vm.openDialog = openDialog;
function openDialog(item) {
$mdDialog.show({
parent: angular.element(document.body),
templateUrl: 'App/views/testDialog.html',
controller: function TestCtrl($scope, objItem) {
var vm = this;
vm.textInput = objItem;
vm.klickOK = klickOK;
function klickOK(item) {
$mdDialog.hide(item);
}
},
controllerAs: 'c',
preserveScope: true,
locals: {
objItem: item
}
}).then(function (item) {
//e.g. the first item
vm.werteliste[0] = item;
}, function () {
alert('Abgebrochen');
});
}
有人可以帮助我吗?!
答案 0 :(得分:1)
如果要将项添加到数组的前面,请使用unshift()方法将项添加到数组的开头。 vm.werteliste.unsift(项目);
我怀疑问题是你将wert传递给对话而不是fc.werteliste
希望有所帮助
答案 1 :(得分:0)
我相信您只需将结果item
分配给openDialog item
您也可能需要$scope.$apply
vm.openDialog = openDialog;
function openDialog(item) {
$mdDialog.show({
parent: angular.element(document.body),
templateUrl: 'App/views/testDialog.html',
controller: function TestCtrl($scope, objItem) {
var vm = this;
vm.textInput = objItem;
vm.klickOK = klickOK;
function klickOK(item) {
$mdDialog.hide(item);
}
},
controllerAs: 'c',
preserveScope: true,
locals: {
objItem: item
}
}).then(function (resultItem) {
//e.g. the first item
item = resultItem;
$scope.$apply(); // maybe its unnecessary
}, function () {
alert('Abgebrochen');
});
}