CODEWITHSUNDEEP
javascriptangularjs
user3522457
user3522457

Reputation: 2963

ng-model doesn't work when within angular bootstrap ui

ng-model doesn't work like this : plunker link

I tried to alert ng-model="selectedFriend" and expect a pop-up of friend's name, but something is wrong when it's used within tab's content of angular bootstrap ui.

        <select ng-model="friendsModel" ng-options="friend.name for friend in myFriends.friends.data">
    <option value="">Select friend</option>
    </select>

I suspect it was $scope issue because it work fine here plunker link

Upvotes: 0

Views: 180

Answers (2)

Shivaraj
Shivaraj

Reputation: 613

You can even pass friendsModel as a parameter to selectFriend() method

<button ng-click="selectFriend(friendsModel)">select</button>

and in JS

$scope.selectFriend = function(friendsModel){
    console.log(friendsModel);
  };

Upvotes: 0

pkozlowski.opensource
pkozlowski.opensource

Reputation: 117370

Tabs are creating a new scope and thus you need to add a "famous dot" in your ng-model expression. Those scope-related issues are quite often and you can observe them even with built-in directives like ngInclude.

Finally, here is a working plunk: http://plnkr.co/edit/PPGA8SBwHeEQNAQCZT3K?p=preview

Upvotes: 2

Related Questions