从select更改其他ng模型值.改变正确的方式?AngularJS

Question

<select data-ng-init="selectedItem='previewWidth = 1920; previewHeight = 1080'" data-ng-model="selectedItem" data-ng-change="GetNewData(); {{selectedItem}}">
<option value="previewWidth = 1920; previewHeight = 1080">1</option>
<option value="previewWidth = 2000; previewHeight = 1060">2</option>
<option value="previewWidth = 2080; previewHeight = 2000">3</option>
</select>

单击另一个目标并忽略第一次单击后，我现在的操作方式(参见示例(会更新。我认为这里的更新出错了。有更好的方法更新吗？

需要明确的是：我想用更改2个数据ng模型值。

编辑：

<div id="breedte-edit" class="col-6">Breedte
<input id="input-breedte" type="number" data-ng-value="1920" data-ng-min="600" data-ng-max="8000" data-ng-init="previewWidth='1920'" data-ng-model="previewWidth" class="form-control" required="required" aria-label="Sizing example input" maxlength="5">
</div>
<div id="lengte-edit" class="col-6">Lengte
<input id="input-lengte" type="number" data-ng-value="1080" data-ng-min="600" data-ng-max="5000" data-ng-init="previewHeight='1080'" data-ng-model="previewHeight" class="form-control" required="required" aria-label="Sizing example input" maxlength="5">
</div>
<div id="reset-edit" class="col-4" style="margin-top: auto">
<button type="button" class="btn btn-outline-dark" data-ng-click="GetNewData(); previewWidth = 1920; previewHeight = 1080" value="FETCH">Reset</button>
</div>

以上是需要更改值的输入

Answer 1

因此，有多种方法可以使用select来更改previewHeight和previewWidth变量。我将使用一组对象来解决这个问题。

// in controller
// initialize options
$scope.sizeOptions = [ 
{ width: 1920, height: 1080 },
{ width: 2000, height: 1060 },
{ width: 2080, height: 2000 }
];
// initialize preview width/height
// it's is better to avoid using ng-init and to initialize variables in your controller
// set initial select value
$scope.selectedItem = $scope.sizeOptions[0];
// or you could assign them to the variables you chose in your example
//  $scope.previewWidth = $scope.sizeOptions[0].width;
//  $scope.previewHeight = $scope.sizeOptions[0].height;
$scope.GetNewData = function(item){
// do work with item here
// item.width and item.height are available here
// if you are using these width and heights in the view, you might not even need this function.
// you could use selectedItem.width or selectedItem.height in your view
};

// in view (select)
<select data-ng-model="selectedItem" data-ng-change="GetNewData(selectedItem)">
<option ng-repeat='option in sizeOptions' ng-value="option">{{$index}}</option>
</select>

由于这是为学校准备的，我想你对编码和/或angularjs有些陌生。分配/设置变量时要小心。在代码中，有时将previewHeight和previewWidth变量设置为数字类型，有时将数字设置在字符串中。(也许我在你的交叉帖子中看到了这一点(。数字和字符串的计算方式不同，所以只需确定要在用例中使用哪一个即可。