Stack Overflow is a community of 4.7 million programmers, just like you, helping each other.

Join them; it only takes a minute:

Sign up
Join the Stack Overflow community to:
  1. Ask programming questions
  2. Answer and help your peers
  3. Get recognized for your expertise

I wonder if anyone could help me i have created a new directive so i can filter a dropdown list while loading data from a webServer. It all works fine, and i can write the values to the html page using {{ myValue }}, and i can even use ng-model on an input, and it returns the value.

But for some reason, if i try to access the variable ($scope.myValue) via the controller, it says it undefined?

I have created a plunker (doesnt load data from webServer, but just loads basic list values instead), but this seems to work, and my project doesnt, which i dont get as i have copied it from my project!! arhhhh.

If anyone has any ideas, i would really appreicate hearing them.

Plunker http://plnkr.co/edit/c7g2vOQwvWH07I9FYhDB?p=preview

On my page i have

<div search-dropdown text="myText" value="myValue"></div>

The directive is

<div class="btn-group searchDropdown">
    <button type="button" class="btn btn-default">
        <input search-dropdown-input type="text" placeholder="Enter name to search..." ng-model="filterText" ng-change="filter();" />
    </button>
    <button search-dropdown-toggle type="button" class="btn btn-default dropdown-toggle">
        <span class="caret"></span>
        <span class="sr-only">Split button!</span>
    </button>
    <ul class="dropdown-menu" role="menu">
        <li ng-repeat="item in items"><a href="javascript:void(0);" ng-click="selectItem($index);">{{ item.name }}</a></li>
    </ul>
</div>
share|improve this question
    
At which point you load data to your app? – maurycy Jul 18 '14 at 11:40

You said you are loading it from webServer, could it be that you are trying to use that variable before the data from the back-end was assigned to it?

I would suggest to use something like:

$socpe.$watch("myValue", function (newVal) {console.log(newVal);})

or:

$timeout(function () {console.log($scope.myValue);}, 5000)

The idea is to print the variable value after the back-end AJAX request finished. It it will print the correct value than you have to use the $watch function and to what you need to do with the variable after it has the expected value.

share|improve this answer
up vote 0 down vote accepted

It appears that all is fine. The only difference was my angular version.

To fix my version i used an object to pass into my directive instead of two separate variables.

So now my directive properties are populated like so

Text="myObj.text" value="myObj.value"

I guess the "reference" to the variables was some how lost?

Had a similar problem before and this was recommended. I only remembered after i posted on here. Hope this helps someone else

share|improve this answer

Your Answer

 
discard

By posting your answer, you agree to the privacy policy and terms of service.

Not the answer you're looking for? Browse other questions tagged or ask your own question.