我正在开发一个应用程序,它要求我根据关联的 rule.itemType
的值显示各种字段。我遇到的问题是,如果 rule.value
中的先前设置值是 String,我无法修改
对象现在显示需要ng-repeat
中的模型数据对象
的字段。当我尝试分配新值时,它返回:TypeError:无法分配给 ABC123 的只读属性“course”
。
我确实发现,如果该值是一个Object
,它会将其显示为[object Object]
的String
,我就是假设来 self 正在阅读的 Object.prototype.toString()
函数,如果更改,将用新的 String
替换 rule.value
目的。即使这个方向有效,如果我需要对 Object
执行 String
操作,我们最终会回到上述问题。
我附上了示例代码来演示我在下面尝试执行的操作以及一些数据。我还 fork 、修改并链接了回复者的 Plunker,以便您可以看到它的实际效果:
http://plnkr.co/edit/v4gSyc6MbYeGGyJppvnc?p=preview
JavaScript:
var app = angular.module('plunker', []);
app.controller('appCtrl', function ($scope) {
$scope.rules = [
{id: 1, itemType: 'CS', value: {course: 'ABC', number: '123'}},
{id: 2, itemType: 'SA', value: 'ABC123'}
];
});
HTML,带有 Angular v1.3.0:
<body>
<div ng-controller="appCtrl as app">
<div ng-repeat="rule in rules">
Rule {{$index+1}}
<!-- Change the itemType for the rule -->
<select ng-model="rule.itemType">
<option value="SA">String</option>
<option value="CS">Object</option>
</select>
<!-- Fields shown if rule.itemType (SA: String, CS: Object) -->
<input type="text" ng-if="rule.itemType === 'SA'" ng-model="rule.value" />
<span ng-if="rule.itemType === 'CS'">
<input ng-model="rule.value.course" />
<input ng-model="rule.value.number" />
</span>
</div>
</div>
</body>
更新1:
添加了 Ryan Randall 的建议,即使用 ng-change='changeType(rule)
,它提供了我正在寻找的适当行为,例如下面的 plunker。
http://plnkr.co/edit/bFahZj?p=preview
JavaScript 更改:
// Contributed by: http://stackoverflow.com/a/26702691/949704
$scope.typeChange = function (rule) {
if (rule.itemType === 'CS') rule.value = {};
if (rule.itemType === 'SA') rule.value = '';
};
HTML 更改:
<!-- Change the itemType for the rule -->
<select ng-model="rule.itemType" ng-change="changeType(rule)">
<option value="SA">String</option>
<option value="CS">Object</option>
</select>
最佳答案
避免遇到问题的一种方法是在rule.itemType更改时显式设置rule.value。
这是一个包含调整的工作插件:http://plnkr.co/edit/rMfeBe?p=preview
以下内容已添加到选择中:
ng-change="typeChange(rule)"
并且以下内容已添加到 Controller 中:
$scope.typeChange = function(rule) {
if (rule.itemType === 'CS') rule.value = {};
if (rule.itemType === 'SA') rule.value = '';
};
关于javascript - 在 Angular 模型中,可以在 JSON 对象和字符串之间切换值类型吗?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/26684699/