我已经使用角度引导UItabset
来创建两个标签并且两个翼片都textareas
具有一个相关联的ng-model
,我有外部的清除按钮tabset
,我想清除ng-model
的textArea
在活动选项卡时用户按下清除按钮。做这个的最好方式是什么?这是我到目前为止所做的。
的HTML
<tabset>
<tab heading="Tab One">
<textarea data-ng-model="data.tabOne" class="form-control"></textarea>
</tab>
<tab heading="Tab two">
<textarea data-ng-model="data.tabOne" class="form-control"></textarea>
</tab>
</tabset>
<button ng-click="clearFn()" class="btn btn-default btn-float-left">Clear</button>
控制者
.controller('myController', ['$scope', function ($scope) {
$scope.data = {
tabOne: '',
tabTwo: ''
};
$scope.ClearFn = function () {
// I want to clear the model of the active tabs textArea here.
};
}]);
您可以使用选项卡的active
属性来找到当前活动的选项卡。
<tabset>
<tab heading="Tab One" active="activeState.tabOne">
<textarea ng-model="data.tabOne" class="form-control"></textarea>
</tab>
<tab heading="Tab Two" active="activeState.tabTwo">
<textarea ng-model="data.tabTwo" class="form-control"></textarea>
</tab>
</tabset>
并在控制器中:
.controller('myController', ['$scope', function ($scope) {
$scope.data = {
tabOne: 'ONE',
tabTwo: 'TWO'
};
$scope.activeState = {};
$scope.clearFn = function() {
// I want to clear the model of the active tabs textArea here.
for (var key in $scope.activeState) {
if ($scope.activeState[key]) {
// active tab found
$scope.data[key] = '';
return;
}
}
};
}])
Plunker示例: http ://plnkr.co/edit/ioJKua5XTeetBcvjGity?p=preview
本文收集自互联网,转载请注明来源。
如有侵权,请联系[email protected] 删除。
我来说两句