コントローラーでMixinプロパティーを使用する

Question

これはちょっとした例ですが、コントローラーでmixinのプロパティーを使用しようとしています。私は同じことをルートで行い、そのプロパティにアクセスすることができました。私は知っている財産をあらゆる方法で試してみました...私は何を誤解していますか？

// app/mixins/author-data.js 
import Ember from 'ember'; 

export default Ember.Mixin.create({ 
    authorName: 'Example author name', 
}); 

// app/controllers/application.js 
import Ember from 'ember'; 
import AuthorDatas from 'app-name/mixins/author-data'; 

export default Ember.Controller.extend(AuthorDatas, { 

    siteTitle: `Site title`, 

    fromAuthorData: this.get('authorName'), 
    // returns - what is the proper syntax? 

    actions: { 
    showAuthor() { 
     var author = this.get('fromAuthorData'); 
     console.log(`Author from controller: ${author}`); 
    }, 
    }, 

}); 

// app/templates/application.hbs 
{{fromAuthorData}} 

これは動作します...

// app/routes/application.js 
import Ember from 'ember'; 
import AuthorDatas from 'app-name/mixins/author-data'; 

export default Ember.Route.extend(AuthorDatas, { 

    afterModel() { // arbitrary 
    var intro = `Author from route:`; 
    console.log(`${intro} this.authorName`, this.authorName); 
    console.log(`${intro} this.get('author-name')`, this.get('authorName')); 
    }, 

}); 

（私がめざしuldはember-twiddleを作っていますが、リストにないので、Mixinsが同じ方法で動作するかどうかはわかりませんでした）

Answer 1

コントローラのfromAuthorDataプロパティは次のように定義する必要がありますこの（私は思う）：

fromAuthorData: Ember.computed('authorName', function() { 
    return this.get('authorName'); // or whatever derived value you need 
} 

Answer 2

は、我々はあなたが単にオプションで渡しているオブジェクトを作成/拡張するとき、スコープについて話をする必要がある問題を理解するために、あなたのコードがより違いはありません：

let options = { 

    siteTitle: `Site title`, 

    // `this` is undefined since we are in strict mode 
    fromAuthorData: this.get('authorName'), 

    actions: { 
    showAuthor() { 
     var author = this.get('fromAuthorData'); 
     console.log(`Author from controller: ${author}`); 
    }, 
    } 
}; 

export default Ember.Controller.extend(AuthorDatas, options); 

に依存するプロパティにアクセスするがそれを保持するオブジェクトである場合、その値を返すコンテキストとしてオブジェクトと共に実行される関数が必要な場合は、computed propertiesと入力します。 あなたのコードは次のようになります。あなたの例では

// app/controllers/application.js 
import Ember from 'ember'; 
import AuthorDatas from 'app-name/mixins/author-data'; 

const { computed } = Ember; 

export default Ember.Controller.extend(AuthorDatas, { 
    siteTitle: `Site title`, 

    // We add `authorName` as the dependent key, should it change `fromAuthorData` will update 
    fromAuthorData: computed('authorName', function() { 
    // your author data stuff 
    let authorName = this.get('authorName'); 
    // ... 
    return authorDetails; 
    }), 

    actions: { 
    showAuthor() { 
     var author = this.get('fromAuthorData'); 
     console.log(`Author from controller: ${author}`); 
    }, 
    }, 
});