计算属性不在通过needs-property访问的控制器上工作

时间:2014-09-18 23:23:02

标签: javascript ember.js

不知何故,我通过needs属性访问的控制器的计算属性在模板中不起作用。其他常规字符串属性按预期工作。以下是我的代码。 要清楚,我想要实现的是访问userController和userModel的属性实际上我的所有模板/路由(其中一些是计算的)。但是,'user'本身没有页面,所以这就是为什么它没有添加到Router.map中。它只是一个非常重要的类,它处理与用户相关的所有内容并处理对用户模型的访问。 我希望有更多余烬经验的人知道我做错了什么。或者也许就如何做到这一点有一些建议呢?任何帮助是极大的赞赏! PS:我尽量做到尽可能完整,如果我忘了smt让我知道,我会加上它。

App.Router.map(function() {
this.resource('signup');
this.resource('login');
this.resource('profile');
this.resource('practice');
this.resource('overview');
});

App.ApplicationRoute = Ember.Route.extend({
model: function () {
return this.store.find('user');
  }
});

App.LoginRoute = Ember.Route.extend({
controllerName: 'application',
model: function () {}
});

App.UserRoute = Ember.Route.extend({
    model: function () {
        return this.store.find('user');
    }
});

//UserController
App.UserController = Ember.ArrayController.extend({
    //pagetitle property to test. Working.
    pageTitle: 'Usercontroller',
    //userArray property to test, but didn't work. 
    // Makes sense since the Arraycontroller return an array, so you'll have to use #each-helper
    userArray: function(){
    return this.get('content');
    },
    //particularUser computed property to test, but also didn't work. 
    // Neither did looping #each through the userArray property
    particularUser : Ember.computed.filterBy('content' , 'username', 'Sunchild')
});

//LoginController
App.LoginController = Ember.ArrayController.extend({
    needs: ['user'],
    pageTitle: 'test-title loginController'
});

// Login template feeded into an outlet in the application template
<script type="text/x-handlebars" id="login">
    <div class="content">
        <form class="input-group">
            <div class="input-row">
                <label>Username</label>
                <input type="text" placeholder="Username">
            </div>
            <div class="input-row">
            <label>Email</label>
            <input type="email" placeholder="ratchetframework@gmail.com">
            </div>
            <button class="btn btn-primary btn-block btn-outlined">Login</button>
        </form>
        <h3> test1:{{controllers.user.pageTitle}}</h3>
        <h3> test2:{{controllers.user.userArray}}</h3>
        {{#each user in controllers.user.particularUser}}
            <div class="card_wrapper">
                <p><h3>Username: {{{user.username}}}</h3><p>
                <p>email: {{user.email}}</p>
            </div>
        {{/each}}
    </div>
</script>

1 个答案:

答案 0 :(得分:0)

路由器中没有user路由,model中的UserRoute挂钩将永远无法运行。这意味着您UserController的模型将始终为空。因此,您设置的方式将不适用于您的用例。 但是,您在ApplicationRoute上拥有相同型号,那么为什么不使用该控制器?

App.ApplicationController = Ember.ArrayController.extend({
    // Never use the `content` property, always use the `model` property, they are different
    userArray: Ember.computed.alias('model'),

    particularUser: function() {
        // Be sure to only grab the first item, not an array with the first item in it
        return this.get('userArray').filterBy('username', 'Sunchild').get('firstObject');
    }.property('userArray.@each.username')
});

这很好,因为您的应用程序路由在任何其他路由之前运行,因此这些数据始终可用。所以在LoginController

App.LoginController = Ember.ArrayController.extend({
    needs: ['application'],
    userArray: Ember.comptued.alias('controllers.application.userArray']
});

希望能稍微清楚一点。