我正在编写一个具有此设置模型的ember应用程序,我用它来绕过路由,因为我想要一个网址。但是,我收到了这个错误:
Error: Cannot perform operations on a Metamorph that is not in the DOM.
当我更改模型中的任何数据时。我比较陌生,但从我读到的内容来看,你应该能够很好地改变一个模型。这是我的html文件:
<script type="text/x-handlebars" data-template-name="index">
<div class="navbar navbar-fixed-top">
<div class="navbar-inner">
<div class="container">
<a class="btn btn-navbar" data-toggle="collapse" data-target=".nav-collapse">
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
</a>
<a class="brand" href="#"><img src="./img/MySpending.png"></a>
<div class="nav-collapse">
<ul id="navWrapper" class="nav">
{{#if model.isIndex}}
{{partial "indexNav"}}
{{/if}}
{{#if model.isMonthly}}
{{partial "monthlyNav"}}
{{/if}}
{{#if model.isYearly}}
{{partial "yearlyNav"}}
{{/if}}
</ul>
</div>
<div class='navbar_form pull-right'></div>
</div>
</div>
</div>
<div id="bodyWrapper" class="container" style="padding-top:60px;">
{{#if model.isIndex}}
{{partial "indexPage"}}
{{/if}}
{{#if model.isMonthly}}
{{partial "monthlyPage"}}
{{/if}}
{{#if model.isYearly}}
{{partial "yearlyPage"}}
{{/if}}
</div>
{{outlet}}
每个部分最初工作正常。
当我在app.js中的三个常规函数中更改它时,我遇到了问题。这是我的app.js:
App = Ember.Application.create();
App.Router.map(function() {
// put your routes here
});
App.settings=Ember.Object.extend({
isIndex: true,
isMonthly: false,
isYearly: false
});
Settings=App.settings.create();
//App.SettingsController = Ember.ObjectController.extend(Settings); Not sure whether to put this in or not
App.IndexRoute = Ember.Route.extend({
model: function() {
return Settings;
}
});
function goToMonthly(){
Settings.set('isIndex',false);
Settings.set('isMonthly',true);
Settings.set('isYearly',false);
}
function goToYearly(){
Settings.set('isIndex',false);
Settings.set('isMonthly',false);
Settings.set('isYearly',true);
}
function goToIndex(){
Settings.set('isIndex',true);
Settings.set('isMonthly',false);
Settings.set('isYearly',false);
}
所以我不确定错误在哪里,但如果有人可以提供帮助,我们将非常感激。
答案 0 :(得分:1)
这里的方法存在根本性错误。您的路径/控制器旨在为您处理模型,因此通过在这些对象之外声明您的模型,您将为自己做更多的工作并导致自己陷入潜在的麻烦。
我没有看到你的“goTo”函数被调用的位置(我假设它们在部分内部,但如果它们在HTML中并且我错过了它,那就是我的坏事)。但是这里应该引用它们:
App.SettingsController = Ember.ObjectController.extend({
actions:{
goToMonthly:function(){
this.set('isIndex', false);
this.set('isMonthly', true);
this.set('isYearly', false);
},
//Other functions go here
}
});
然后在你的html中,使用把手调用这些动作:
<a {{action 'goToMonthly'}}> Click this to run the action </a>
答案 1 :(得分:0)
您使用的是哪个版本的ember?我用ember 1.2和1.3试过它,你的例子工作正常。