Binding error in article-list, comment and article-actions components.

[yoomury]

Hi there, it seems that there is an issue with the article-list, comment and article-actions components. The binding values from the components are not accessible in the controllers. Any ideea of a solution?

[mirceananes]

The problem seems to be in the ArticleListCtrl 's constructor. The call to setListTo() is made with an undefined variable. Comment the line and the rest should work fine in Angular 1.5 (//this.setListTo(this.listConfig);)

[bstelljes]

As a workaround I made a method outside of the constructor. There you have access to the bindings (like in the follow button component).

canModify() {
   if (this._User.current) {
    return (this._User.current.username === this.article.author.username);
  }
  else {
    return false;
  }
}

and remember to update your template:

<span ng-show="$ctrl.canModify()">

[RawleJuglal]

I've been working https://thinkster.io/angularjs-es6-tutorial#compartmentalizing-page-functionality-into-components tutorial trying to prep myself to move to angular 2. I'm getting error TypeError: Cannot read property 'author' of undefined, which I think follows along with this issue. The article html populates with the article data before I try to add the canModify code above but does not once this step is added. This is my project if anyone wants to look and see if this just an error by me https://github.com/RawleJuglal/flow_news_app/tree/front_end

4/25/17 Edit:
Hey I thought I should come back and update that a stackoverflow user pointed out that my project was upgraded past Angular 1.5 and so how it is written works for 1.5 but must be taken out of the constructor and placed in the $onInit() function starting with 1.6. So for anyone searching for help, this could be a reason. But again, tutorial is correct if you are using 1.5.

[hht1230]

RawleJuglal, thank you for that! In package.json, I changed
"angular": "^1.5.0-rc.2"
to
"angular": "~1.5.0"
and all works as advertised.

[BalasubramaniM]

As @hht1230 said, Changing angular version from "^1.5.0-rc.2" to "~1.5.0" works perfectly and solves all the problem.

Also @bstelljes solution to the problem has also been resolved with this change. Thanks guys for the solution.

[gapablaza]

To be able to use angular "1.6" (keeping "^1.5.0-rc.2" in package.json) in the constructor wrap the validation inside "$onInit" (thanks @RawleJuglal ) this way:

this.$onInit = () => {
  // The users can only edit/delete this article if they are the author
  if (User.current) {
    this.canModify = (User.current.username === this.article.author.username);
  } else {
    this.canModify = false;
  }
}