2

See fiddle http://jsfiddle.net/5FdgC/2

var myModule = angular.module('myModule', [])
    .controller('MyCtrl', ['$scope', function ($scope) {


        $scope.model = { name: ' hans', game: 'wow' };

        $scope.items = [{ name: ' jens', game: 'wow' }, { name: ' hans', game: 'wow' }];

        $scope.equal = angular.equals($scope.items[1], $scope.model);

    }]);

myModule.directive('selectBlock', function () {

    return {
        restrict: 'A',
        replace: true,
        template: '<select ng-model="model" ng-options="item.name for item in items"></select>',

        scope: {
            model: '=',
            items: '='
        },
        link: function (scope, element, attributes) {
        }
    }
});

Problem:

I pass a model and some items. model angular.equals to true with an object in items. However, setting ng-model="model" in the select does not display model in the dropdown. It remains blank with the items listed beneath.

Say

items = [ob1, ob2]
angular.equals(ob2, model) = true
ng-model="model"

select renders as

--blank--  //selected value
ob1
ob2

instead of

ob1
ob2 // selected value

Cheers

Hawk
  • 1,513
  • 1
  • 14
  • 17
  • **not the answer you are looking for** but you should use ng-class to assign classes. Binding into the `class` attribute is not a good practice ( http://docs.angularjs.org/api/ng.directive:ngClass ). I.E. you should replace `class="control-label {{controlLabelClass}}"` -> `class="control-label" ng-class="controlLabelClass"`. BTW, I didnt understand your problem – Utopik Sep 10 '13 at 12:36
  • Hey, thanks for answering and I'll read up on ng-class and start to use it. I've updated my question. See if it makes more sense now. – Hawk Sep 10 '13 at 12:44
  • I understand now. Can you provide a jsfiddle so that I (and others) can make some tests ? – Utopik Sep 10 '13 at 12:51

1 Answers1

2

Ok, I have found the problem.

http://jsfiddle.net/5FdgC/3/

.controller('MyCtrl', ['$scope', function ($scope) {

    $scope.items = [{ name: ' jens', game: 'wow' }, { name: ' hans', game: 'wow' }];
    // here, you have to set the default by reference, not by value.
    $scope.model = $scope.items[1];
[...]
Utopik
  • 3,783
  • 1
  • 21
  • 24
  • Hey. I removed some text from my question, but I had this solution there earlier. The thing is that this makes the model dirty. If I have model and a masterModel, they will now be unequal. I guess I will have to have a watcher to check for when the model gets reset. I'll mark it as the answer as I guess there is no way around. Thanks for your time and help! – Hawk Sep 10 '13 at 13:47
  • This answer might help you: http://stackoverflow.com/questions/12654631/why-does-angularjs-include-an-empty-option-in-select – sgimeno Sep 10 '13 at 13:49
  • I can't help you about the "dirty" thing, I suck at forms in angular. Sorry :/ – Utopik Sep 10 '13 at 13:49