Anyone have this issue in chapter 1 step 5, I can't get the addstock modal to come up

Error: [$compile:ctreq] Controller 'select', required by directive 'ngOptions', can't be found!
http://errors.angularjs.org/1.4.3/$compile/ctreq?p0=select&p1=ngOptions
minErr/<@http://localhost:9000/bower_components/angular/angular.js:68:12
getControllers@http://localhost:9000...lar/angular.js:8007:19

in the addstock-modal.html:

ng-options="company as company.label for company in companies"
bs-typeahead

I wonder if it's a version issue with angular-strap

thanks for any insights

What a coincidence. I started the book earlier this week and I'm in the same spot. I think it's because the latest versions of Angular and AngularStrap are used. Now I haven't solved this, but maybe the information below will help drive to resolution.

It's clear the problematic issue is in app/views/templates/addstock-modal.html for the stock symbol field:

<input type="text"
class="form-control"
id="stock-symbol"
placeholder="Stock Symbol"
ng-model="newStock.company"
ng-options="company as company.label for company in companies"
bs-typeahead
required>

Looking at the Angular documentation, ng-options requires a select element. I did some research on AngularStrap's typeaheads documentation and I was able to make some progress substituting "ng-options" with "bs-options". The add stock modal comes up, but doesn't add the stock to the watchlist. As imagined, another error message appears.

I know this isn't the solution, but hopefully it can give some additional insight to help drive to solution. I'll post as I find more info.

Hi,

thanks for the feedback. I also solved by using bs-options. I first installed the latest Angular-strap. Like you I also get the modal up and when I enter the stock symbol and amount it blows up because it can't find the addstock function in the watchlist object. Inspecting the watchlist object I find it is empty. Not sure yet what's going on.

thanks

I figured it out... Yeoman automatically adds "controllerAs: 'watchlist'" to the route causing a conflict with the keyword. We wont be using the controllerAs alias so you can just comment it out like below(or just change either variable name):

EDIT: app/scripts/app.js

Voila! Working code and no more head scratching.

Wow, good job! Way to go Dougal83 and everyone. I was actually comparing the book's code on his site and I noticed that too but I didn't get quite get round to diving deeper. On his site https://github.com/diegonetto/stock-...scripts/app.js, no controllerAs:

.config(function ($routeProvider) {
$routeProvider
.when('/dashboard', {
templateUrl: 'views/dashboard.html',
controller: 'DashboardCtrl'
})
.when('/watchlist/:listId', {
templateUrl: 'views/watchlist.html',
controller: 'WatchlistCtrl'
})
.otherwise({
redirectTo: '/dashboard'
});

Thanks for posting that. Been scratching my head all day :-)

btw, I hope we will all continue to share our experiences here (new threads, etc) as we work through this book. I plan to anyway. I think it is a great way to learn this, and I think it is a great book and I do understand that as code/versions change we'll run into issues.

On to the next issue ... :-)

cheers

John (aka allegrojm)

On another note, I wish I could understand what exactly is happening. Being a relative newbie to this stuff (but a long time software developer), I can only think it's related to the scope somehow.

thanks

I thought it was a typical scope issue whereby the variable is not visible(passed through). Although you assign to the watchlist variable, when the scope is passed to the modal the controllerAs variable is reasserted, thus overwriting your assignment.

It's confusing and a weakness of javascript code integrity checking. Traditionally a compiled language like c# could flag up the ambiguity like here using the same keyword. Javascript lacks this facility so it relies on the developer to guard against ambiguity rigorously using naming conventions.

That's how I see it anyway!

Hello, Allegrojm and Dougal83. I'm wondering if you guys are able to actually ADD stocks, as is supposed to occur in Step 5? I have the modal and stock typeahead json file referencing fine, yet the app just won't add stocks. I see support here is non-existent, so I'm hoping some fellow coders can lend a hand. It makes no sense, as I'm using source compared against the Github repository, and I have to assume the master source code is off. Thanks in advance!

Ugh. I figured this out, for future reference: Several hours debugging later, I finally tried deleting and then re-adding all the titles in the watchlist, like Technology, Financial, etc. Now it works! Again, ugh.

:) Glad you figured it out.

The instructions in the book do call for things to be deleted at certain stages as you develop following each step. Maybe it was one of those moments. Happy coding!