我想根据用户点击的内容更改对象变量mF
,这会将对象数组中的一个对象分配给变量mF
,并且还采用他们到下一个“页面”。
我正在使用 ng-click 通过函数将对象分配给 mf
。我正在使用 {{ mF.name }}
来测试是否已将新对象分配给 mF
并且我一直绘制空白(没有任何内容输出到页面)。但是,当我在 Controller 中手动分配对象并使用console.log()输出时,它正在工作。为什么没有输出到页面?
代码:
app.js:
app.controller('DeviceController', function($scope) {
$scope.showOptions = false;
var device1 = [
{
name: 'PC',
os: 'Windows',
chosen: false,
},
...
];
var device2 = [
{...}
...
];
var mF = {};
$scope.mF = mF;
console.log(mF);
function calculate (x) {
mF = device1[x];
}
mF = device1[0];
console.log(mF.name); //outputs correctly in console - "PC"
});
HTML:
<div ng-hide="showOptions">
<div class="osSelect"><span ng-click="calculate(0); showOptions = true">Win</span>
<span ng-click="calculate(1); showOptions = true">Mac</span> <span ng-click="showOptions = true">test</span></div>
</div>
<div class="pageHolder2" ng-show="showOptions">
<p>This is the 2nd page: {{ mF.name }}</p> <!-- outputs blank where expression is -->
<span class="back" ng-click="showOptions = false">Back</span>
</div>
最佳答案
您还需要将函数calculate
附加到作用域,以便从 View 绑定(bind)调用它。
所以尝试一下:
$scope.calculate = function calculate (x) {
$scope.mF = device1[x];
}
关于javascript - 无法更改页面中的对象值,但在控制台日志中显示为工作(AngularJS),我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/30227426/