控制器沒有得到父數據

Question

我正在做一個超過角1.5的教程，我已經深入瞭解它，其中一個部分似乎有關將當前用戶與作者用戶名匹配的問題。該類注入用戶服務，我認爲假設我可以從作者的父控制器繼承，但它未定義。我嘗試了注入$ scope，然後將一個變量設置爲$ scope。$ parent.article（文章是其中有作者名稱的對象），但是這仍然是未定義的。我檢查了父控制器做一個控制檯登錄文章，它確實有我想要得到的數據。這裏是我的項目鏈接，如果你想看看整個事情，但我會盡量只發佈下面的相關代碼。 https://github.com/RawleJuglal/flow_news_app/tree/front_end/src/js

父控制器（article.controller.js）

import marked from 'marked'; 

class ArticleCtrl { 
    constructor(article, $sce, $rootScope) { 
    'ngInject'; 

    this.article = article; 
    console.log(this.article); 
    //THIS IS CONSOLE LOG 
    //{title: "Juglal For StackOverflow", 
     slug: "juglal-for-stackoverflow-ba400n", 
     body: "<p> Need the goods</p>", 
     createdAt: "2017-04-25T14:51:42.131Z", 
     updatedAt: "2017-04-25T14:51:42.131Z", 
     author:{ 
      bio:"I'm a MEAN stack developer. But if I don't find a job in Oklahoma soon, I'll be learning C++/Sharp." 
      following:false 
      image:"https://media.licdn.com/mpr/mpr/shrinknp_200_200/p/6/000/1e9/0e2/3cd7175.jpg" 
      username:"RawleJuglal",.... 
     } 

// Update the title of this page 
$rootScope.setPageTitle(this.article.title); 

this.article.body = $sce.trustAsHtml(marked(this.article.body, { sanitize: true })); 

    } 
} 


export default ArticleCtrl; 

兒童控制器（文章-actions.components.js）

class ArticleActionsCtrl { 
    constructor(Articles, User, $state) { 
    'ngInject'; 

    this._Articles = Articles; 
    this._$state = $state; 

//Code that causes the error because this.article.author.username is undefined 
    if (User.current) { 
     this.canModify = (User.current.username === this.article.author.username); 
    } else { 
     this.canModify = false; 
    } 
    } 
} 

let ArticleActions = { 
    bindings: { 
    article: '=' 
    }, 
    controller: ArticleActionsCtrl, 
    templateUrl: 'article/article-actions.html' 
}; 

export default ArticleActions; 

HTML（article.html）//以防萬一這個問題

<div class="article-page"> 
    <div class="banner"> 
    <div class="container"> 
     <h1 ng-bind="::$ctrl.article.title"></h1> 
     <article-actions article="$ctrl.article"></article-actions> 
    </div> 
    </div> 
    <div class="container page"> 
    <div class="row article-content"> 
     <div class="col-xs-12"> 
     <div> 
      <div ng-bind-html="::$ctrl.article.body"></div> 
     </div> 
     <ul class="tag-list"> 
      <li class="tag-default tag-pill tag-outline" 
      ng-repeat="tag in ::$ctrl.article.tagList"> 
      {{ tag }} 
      </li> 
     </ul> 
     </div> 
    </div> 
<hr /> 
<div class="article-actions"> 
    <article-actions article="$ctrl.article"></article-actions> 
</div> 
<div class="row"> 
    <div class="col-xs-12 col-md-8 offset-md-2"> 
    <div> 
     <form class="card comment-form"> 
     <div class="card-block"> 
      <textarea class="form-control" 
      placeholder="Write a comment..." 
      rows="3"></textarea> 
     </div> 
      <div class="card-footer"> 
       <img class="comment-author-img" /> 
       <button class="btn btn-sm btn-primary" type="submit"> 
       Post Comment 
       </button> 
      </div> 
      </form> 
     </div> 

     <div class="card"> 
      <div class="card-block"> 
      <p class="card-text">This is an example comment.</p> 
      </div> 
      <div class="card-footer"> 
      <a class="comment-author" href=""> 
       <img class="comment-author-img" /> 
      </a> 
      &nbsp; 
      <a class="comment-author" href=""> 
       BradGreen 
      </a> 
      <span class="date-posted"> 
       Jan 20, 2016 
      </span> 
      </div> 
     </div> 
     </div> 
    </div> 
    </div> 
</div> 

Answer 1

事實上，你的例子將使用角1.5而不是> 1.6。

這裏的原因是：

與角1.6，綁定尚未在構造函數中設置啓動。如果您需要它們，請將您的代碼移至$onInit函數。

這是你的新ArticleActionsCtrl：

class ArticleActionsCtrl { 
    constructor(Articles, User, $state) { 
    'ngInject'; 

    this._Articles = Articles; 
    this._$state = $state; 
    this.User = User; 
    } 

    $onInit() {  
    if (this.User.current) { 
     this.canModify = (this.User.current.username === this.article.author.username); 
    } else { 
     this.canModify = false; 
    } 
    } 
} 

let ArticleActions = { 
    bindings: { 
    article: '=' 
    }, 
    controller: ArticleActionsCtrl, 
    templateUrl: 'article/article-actions.html' 
}; 

export default ArticleActions; 

我沒有測試它，不要猶豫，告訴我，如果你有任何問題的。